mirror of
https://github.com/jupyterhub/jupyterhub.git
synced 2025-10-10 03:23:04 +00:00
Updated Groups to testing-library
This commit is contained in:
@@ -19,7 +19,7 @@ const Groups = (props) => {
|
|||||||
var { updateGroups, history } = props;
|
var { updateGroups, history } = props;
|
||||||
|
|
||||||
if (!groups_data || !user_data) {
|
if (!groups_data || !user_data) {
|
||||||
return <div></div>;
|
return <div data-testid="no-show"></div>;
|
||||||
}
|
}
|
||||||
|
|
||||||
const dispatchPageChange = (data, page) => {
|
const dispatchPageChange = (data, page) => {
|
||||||
@@ -39,7 +39,7 @@ const Groups = (props) => {
|
|||||||
}
|
}
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="container">
|
<div className="container" data-testid="container">
|
||||||
<div className="row">
|
<div className="row">
|
||||||
<div className="col-md-12 col-lg-10 col-lg-offset-1">
|
<div className="col-md-12 col-lg-10 col-lg-offset-1">
|
||||||
<div className="panel panel-default">
|
<div className="panel panel-default">
|
||||||
|
@@ -1,12 +1,14 @@
|
|||||||
import React from "react";
|
import React from "react";
|
||||||
import Enzyme, { mount } from "enzyme";
|
import "@testing-library/jest-dom";
|
||||||
import Groups from "./Groups";
|
import { act } from "react-dom/test-utils";
|
||||||
import Adapter from "@wojtekmaj/enzyme-adapter-react-17";
|
import { render, screen } from "@testing-library/react";
|
||||||
import { Provider, useDispatch, useSelector } from "react-redux";
|
import { Provider, useDispatch, useSelector } from "react-redux";
|
||||||
import { createStore } from "redux";
|
import { createStore } from "redux";
|
||||||
import { HashRouter } from "react-router-dom";
|
import { HashRouter } from "react-router-dom";
|
||||||
|
// eslint-disable-next-line
|
||||||
|
import regeneratorRuntime from 'regenerator-runtime'
|
||||||
|
|
||||||
Enzyme.configure({ adapter: new Adapter() });
|
import Groups from "./Groups";
|
||||||
|
|
||||||
jest.mock("react-redux", () => ({
|
jest.mock("react-redux", () => ({
|
||||||
...jest.requireActual("react-redux"),
|
...jest.requireActual("react-redux"),
|
||||||
@@ -14,7 +16,6 @@ jest.mock("react-redux", () => ({
|
|||||||
useDispatch: jest.fn(),
|
useDispatch: jest.fn(),
|
||||||
}));
|
}));
|
||||||
|
|
||||||
describe("Groups Component: ", () => {
|
|
||||||
var mockAsync = () =>
|
var mockAsync = () =>
|
||||||
jest.fn().mockImplementation(() => Promise.resolve({ key: "value" }));
|
jest.fn().mockImplementation(() => Promise.resolve({ key: "value" }));
|
||||||
|
|
||||||
@@ -33,6 +34,7 @@ describe("Groups Component: ", () => {
|
|||||||
groups_data: JSON.parse(
|
groups_data: JSON.parse(
|
||||||
'[{"kind":"group","name":"testgroup","users":[]}, {"kind":"group","name":"testgroup2","users":["foo", "bar"]}]'
|
'[{"kind":"group","name":"testgroup","users":[]}, {"kind":"group","name":"testgroup2","users":["foo", "bar"]}]'
|
||||||
),
|
),
|
||||||
|
limit: 10,
|
||||||
});
|
});
|
||||||
|
|
||||||
beforeEach(() => {
|
beforeEach(() => {
|
||||||
@@ -48,18 +50,41 @@ describe("Groups Component: ", () => {
|
|||||||
useSelector.mockClear();
|
useSelector.mockClear();
|
||||||
});
|
});
|
||||||
|
|
||||||
it("Renders groups_data prop into links", () => {
|
test("Renders", async () => {
|
||||||
let callbackSpy = mockAsync(),
|
let callbackSpy = mockAsync();
|
||||||
component = mount(groupsJsx(callbackSpy)),
|
|
||||||
links = component.find("li");
|
await act(async () => {
|
||||||
expect(links.length).toBe(2);
|
render(groupsJsx(callbackSpy));
|
||||||
});
|
});
|
||||||
|
|
||||||
it("Renders nothing if required data is not available", () => {
|
expect(screen.getByTestId("container")).toBeVisible();
|
||||||
|
});
|
||||||
|
|
||||||
|
test("Renders groups_data prop into links", async () => {
|
||||||
|
let callbackSpy = mockAsync();
|
||||||
|
|
||||||
|
await act(async () => {
|
||||||
|
render(groupsJsx(callbackSpy));
|
||||||
|
});
|
||||||
|
|
||||||
|
let testgroup = screen.getByText("testgroup");
|
||||||
|
let testgroup2 = screen.getByText("testgroup2");
|
||||||
|
|
||||||
|
expect(testgroup).toBeVisible();
|
||||||
|
expect(testgroup2).toBeVisible();
|
||||||
|
});
|
||||||
|
|
||||||
|
test("Renders nothing if required data is not available", async () => {
|
||||||
useSelector.mockImplementation((callback) => {
|
useSelector.mockImplementation((callback) => {
|
||||||
return callback({});
|
return callback({});
|
||||||
});
|
});
|
||||||
let component = mount(groupsJsx());
|
|
||||||
expect(component.html()).toBe("<div></div>");
|
let callbackSpy = mockAsync();
|
||||||
|
|
||||||
|
await act(async () => {
|
||||||
|
render(groupsJsx(callbackSpy));
|
||||||
});
|
});
|
||||||
|
|
||||||
|
let noShow = screen.getByTestId("no-show");
|
||||||
|
expect(noShow).toBeVisible();
|
||||||
});
|
});
|
||||||
|
Reference in New Issue
Block a user