Hi. I'm new to storybook and I'm having an issue writing a test for an element not in DOM
await step('Menu opens and closes', async () => {
// Getting the trigger
const trigger = canvas.getByRole('button', {
name: 'application-switcher-menu-toggle',
});
// Getting the menu label
const label = canvas.getByText('Switch to');
// I expect it not to be in the document because the trigger has not been clicked
expect(label).not.toBeInTheDocument();
// Click trigger
await userEvent.click(trigger);
// Expect label to be in document
expect(label).not.toBeInTheDocument();
// Click trigger again
await userEvent.click(trigger);
// Expect label not to be in document
expect(label).not.toBeInTheDocument();
});
The test by itself is okay but canvas.getByText('Switch to') results in error saying 'Unable to find an element with the text: Switch to.'