Steve Kinney

Building Design Systems with Storybook

Solution: Checking a Disabled Text Area

export const Disabled: Story = {
	args: {
		disabled: true,
	},
	play: async ({ canvasElement }) => {
		const canvas = within(canvasElement);
		const textArea = canvas.getByRole('textbox');

		expect(textArea).toBeDisabled();
		await userEvent.type(textArea, 'Hello, world!');
		expect(textArea).toHaveValue('');
	},
};

Last modified on .