Skip to content

Commit

Permalink
fix(node-admin): fix tests wait for expect timer
Browse files Browse the repository at this point in the history 
It's impossible to use wait-for-expect and legacy fake timers with Jest v27.

So is needed to set legacy timers when using wait for expect and change to fake timers when need to `advanceTimersByTime`.

TheBrainFamily/wait-for-expect#34
TheBrainFamily/wait-for-expect#30
  • Loading branch information
@selankon
selankon committed Jan 20, 2023
1 parent 99447c9 commit 45017a4
Showing 1 changed file with 117 additions and 65 deletions.
182 changes: 117 additions & 65 deletions plugins/lime-plugin-node-admin/src/screens/hotspot/hotspot.spec.js
View file
Original file line number Diff line number Diff line change
@@ -1,33 +1,30 @@
import "@testing-library/jest-dom";
import { act, cleanup, fireEvent, screen } from "@testing-library/preact";
import waitForExpect from "wait-for-expect";

import { screen, cleanup, act, fireEvent } from '@testing-library/preact';
import '@testing-library/jest-dom';
import { render } from 'utils/test_utils';
import queryCache from 'utils/queryCache';
import waitForExpect from 'wait-for-expect';
import Hotspot from './src/hotspotPage';
import { enable, disable, getStatus } from './src/hotspotApi';
jest.mock('./src/hotspotApi');
jest.mock('utils/api');
import queryCache from "utils/queryCache";
import { render } from "utils/test_utils";

const findConnectCheckbox = async () =>
screen.findByLabelText('Connect to a Mobile Hotspot');
import { disable, enable, getStatus } from "./src/hotspotApi";
import Hotspot from "./src/hotspotPage";

const findSubmitButton = async () =>
screen.findByRole('button', { name: /save/i });
jest.mock("./src/hotspotApi");
jest.mock("utils/api");

describe('hotspot', () => {
beforeAll(() => {
jest.useFakeTimers();
});
const findConnectCheckbox = async () =>
screen.findByLabelText("Connect to a Mobile Hotspot");

afterAll(() => {
jest.useRealTimers();
});
const findSubmitButton = async () =>
screen.findByRole("button", { name: /save/i });

describe("hotspot", () => {
beforeEach(() => {
enable.mockImplementation(async () => null);
disable.mockImplementation(async () => null);
getStatus.mockImplementation(async () => ({ enabled: false, connected: false }));
getStatus.mockImplementation(async () => ({
enabled: false,
connected: false,
}));
});

afterEach(() => {
Expand All @@ -38,31 +35,49 @@ describe('hotspot', () => {
act(() => queryCache.clear());
});

it('shows config description', async () => {
it("shows config description", async () => {
render(<Hotspot />);
expect(await screen.findByText('Share your mobile connection by connecting the node to a mobile hotspost')).toBeInTheDocument();
expect(
await screen.findByText(
"Share your mobile connection by connecting the node to a mobile hotspost"
)
).toBeInTheDocument();
});

it('shows expandable cellphone Instructions', async () => {
it("shows expandable cellphone Instructions", async () => {
render(<Hotspot />);
const text = await screen.findByText('Cellphone Instructions');
const text = await screen.findByText("Cellphone Instructions");
expect(text).toBeInTheDocument();
fireEvent.click(text);
expect(await screen.findByText('Get an additional cell phone to the one you are currently using that has a mobile data connection')).toBeInTheDocument();
expect(await screen.findByText('With this second cell phone create an access point or hotspot with this data:')).toBeInTheDocument();
expect(await screen.findByText('Network Name: internet')).toBeInTheDocument();
expect(await screen.findByText('Password: internet')).toBeInTheDocument();
expect(await screen.findByText('Encryption: WPA2 PSK')).toBeInTheDocument();
expect(
await screen.findByText(
"Get an additional cell phone to the one you are currently using that has a mobile data connection"
)
).toBeInTheDocument();
expect(
await screen.findByText(
"With this second cell phone create an access point or hotspot with this data:"
)
).toBeInTheDocument();
expect(
await screen.findByText("Network Name: internet")
).toBeInTheDocument();
expect(
await screen.findByText("Password: internet")
).toBeInTheDocument();
expect(
await screen.findByText("Encryption: WPA2 PSK")
).toBeInTheDocument();
fireEvent.click(text);
expect(screen.queryByText('Password: internet')).toBeNull();
expect(screen.queryByText("Password: internet")).toBeNull();
});

it('shows an unchecked checkbox to enable the hotspot client', async () => {
it("shows an unchecked checkbox to enable the hotspot client", async () => {
render(<Hotspot />);
expect(await findConnectCheckbox()).not.toBeChecked();
});

it('calls the endpoint to enable the hotspot client when checked', async () => {
it("calls the endpoint to enable the hotspot client when checked", async () => {
render(<Hotspot />);
fireEvent.click(await findConnectCheckbox());
fireEvent.click(await findSubmitButton());
Expand All @@ -71,32 +86,49 @@ describe('hotspot', () => {
});
});

it('shows an error message if the hotspot can not be found', async () => {
enable.mockImplementation(async () => { throw 'hotspot ap not found' });
it("shows an error message if the hotspot can not be found", async () => {
enable.mockImplementation(async () => {
throw "hotspot ap not found";
});
render(<Hotspot />);
fireEvent.click(await findConnectCheckbox());
fireEvent.click(await findSubmitButton());
expect(await screen.findByText("The hotspot couldn’t be found," +
" please review the instructions above.")).toBeInTheDocument();
expect(
await screen.findByText(
"The hotspot couldn’t be found," +
" please review the instructions above."
)
).toBeInTheDocument();
});

it('shows an error message if there are mesh ifaces in the radio 0', async () => {
enable.mockImplementation(async () => { throw 'radio has mesh ifaces' });
it("shows an error message if there are mesh ifaces in the radio 0", async () => {
enable.mockImplementation(async () => {
throw "radio has mesh ifaces";
});
render(<Hotspot />);
fireEvent.click(await findConnectCheckbox());
fireEvent.click(await findSubmitButton());
expect(await screen.findByText("Cannot use Radio 0," +
" it's being used for mesh links")).toBeInTheDocument();
expect(
await screen.findByText(
"Cannot use Radio 0," + " it's being used for mesh links"
)
).toBeInTheDocument();
});

it('show a checked checkbox when enabled', async () => {
getStatus.mockImplementation(async () => ({ enabled: true, connected: false }));
it("show a checked checkbox when enabled", async () => {
getStatus.mockImplementation(async () => ({
enabled: true,
connected: false,
}));
render(<Hotspot />);
expect(await findConnectCheckbox()).toBeChecked();
});

it('calls disable endpoint when checkbox is disabled', async () => {
getStatus.mockImplementation(async () => ({ enabled: true, connected: false }));
it("calls disable endpoint when checkbox is disabled", async () => {
getStatus.mockImplementation(async () => ({
enabled: true,
connected: false,
}));
render(<Hotspot />);
fireEvent.click(await findConnectCheckbox());
fireEvent.click(await findSubmitButton());
Expand All @@ -105,38 +137,58 @@ describe('hotspot', () => {
});
});

it('shows the test box for cellphone connectivity when enabled', async () => {
getStatus.mockImplementation(async () => ({ enabled: true, connected: false }));
it("shows the test box for cellphone connectivity when enabled", async () => {
getStatus.mockImplementation(async () => ({
enabled: true,
connected: false,
}));
render(<Hotspot />);
expect(await screen.findByTestId('hotspot-phone-test')).toBeInTheDocument();
expect(
await screen.findByTestId("hotspot-phone-test")
).toBeInTheDocument();
});

it('shows the test box for internet connectivity when enabled', async () => {
getStatus.mockImplementation(async () => ({ enabled: true, connected: false }));
it("shows the test box for internet connectivity when enabled", async () => {
getStatus.mockImplementation(async () => ({
enabled: true,
connected: false,
}));
render(<Hotspot />);
expect(await screen.findByTestId('hotspot-internet-test')).toBeInTheDocument();
expect(
await screen.findByTestId("hotspot-internet-test")
).toBeInTheDocument();
});

it('shows a loading state with explanation until the router answers again when via wifi', async () => {
it("shows a loading state with explanation until the router answers again when via wifi", async () => {
jest.useFakeTimers();
render(<Hotspot />);
fireEvent.click(await findConnectCheckbox());
getStatus.mockImplementation(async () => {
return new Promise((res,) => {
return new Promise((res) => {
setTimeout(() => {
res({ enabled: true, connected: true, signal: -47 })
res({ enabled: true, connected: true, signal: -47 });
}, 10000);
})
})
});
});
fireEvent.click(await findSubmitButton());
expect(await screen.findByLabelText('loading')).toBeInTheDocument();
expect(screen.queryByTestId('hotspot-phone-test')).toBeNull();
expect(await screen.findByText('The radio needs to be restarted...')).toBeInTheDocument();
expect(await screen.findByText('Please stay connected to the wifi network')).toBeInTheDocument();
expect(screen.queryByTestId('hotspot-phone-test')).toBeNull();
expect(await screen.findByLabelText("loading")).toBeInTheDocument();
expect(screen.queryByTestId("hotspot-phone-test")).toBeNull();
expect(
await screen.findByText("The radio needs to be restarted...")
).toBeInTheDocument();
expect(
await screen.findByText("Please stay connected to the wifi network")
).toBeInTheDocument();
expect(screen.queryByTestId("hotspot-phone-test")).toBeNull();
act(() => {
jest.advanceTimersByTime(10000);
});
expect(await screen.findByTestId('hotspot-phone-test')).toBeInTheDocument();
expect(screen.queryByText('The radio needs to be restarted...')).toBeNull();
jest.advanceTimersByTime(20000);
});
expect(
await screen.findByTestId("hotspot-phone-test")
).toBeInTheDocument();
expect(
screen.queryByText("The radio needs to be restarted...")
).toBeNull();
jest.useRealTimers();
});
});

0 comments on commit 45017a4

Please sign in to comment.