updated tests

storybookjs · Dec 2, 2019 · aa5a654 · aa5a654
1 parent d73733d
commit aa5a654
Show file tree

Hide file tree

Showing 2 changed files with 36 additions and 1,374 deletions.
diff --git a/addons/a11y/src/components/A11YPanel.test.js b/addons/a11y/src/components/A11YPanel.test.js
@@ -1,17 +1,18 @@
 import React from 'react';
 import { mount } from 'enzyme';
+import { EventEmitter } from 'events';
 
 import { ThemeProvider, themes, convert } from '@storybook/theming';
 
 import { A11YPanel } from './A11YPanel';
 import { EVENTS } from '../constants';
 
 function createApi() {
-  return {
-    emit: jest.fn(),
-    on: jest.fn(),
-    off: jest.fn(),
-  };
+  const emitter = new EventEmitter();
+  jest.spyOn(emitter, 'emit');
+  jest.spyOn(emitter, 'on');
+  jest.spyOn(emitter, 'off');
+  return emitter;
 }
 
 const axeResult = {
@@ -76,28 +77,13 @@ describe('A11YPanel', () => {
     expect(api.on.mock.calls[2][0]).toBe(EVENTS.MANUAL);
   });
 
-  it('should show initial state on tab activation', () => {
-    // given
-    const api = createApi();
-
-    const wrapper = mount(<ThemedA11YPanel api={api} />);
-    expect(api.emit).not.toHaveBeenCalled();
-
-    // when
-    wrapper.setProps({ active: true });
-    wrapper.update();
-
-    // then
-    expect(wrapper.find(A11YPanel)).toMatchSnapshot();
-  });
-
   it('should deregister event listener on unmount', () => {
     // given
     const api = createApi();
-    const wrapper = mount(<ThemedA11YPanel api={api} />);
     expect(api.off).not.toHaveBeenCalled();
 
     // when
+    const wrapper = mount(<ThemedA11YPanel api={api} />);
     wrapper.unmount();
 
     // then
@@ -107,131 +93,78 @@ describe('A11YPanel', () => {
     expect(api.off.mock.calls[2][0]).toBe(EVENTS.MANUAL);
   });
 
-  it('should show manual state depending on config', () => {
+  it('should handle "initial" status', () => {
     // given
     const api = createApi();
 
-    const wrapper = mount(<ThemedA11YPanel api={api} />);
-    expect(api.emit).not.toHaveBeenCalled();
-
     // when
-    wrapper.setProps({ active: true });
-    api.emit(EVENTS.MANUAL, true);
-    wrapper.update();
-
-    // then
-    expect(wrapper.find(A11YPanel)).toMatchSnapshot();
-  });
-
-  it('should update run result', () => {
-    // given
-    const api = createApi();
     const wrapper = mount(<ThemedA11YPanel api={api} active />);
-    const onUpdate = api.on.mock.calls.find(([event]) => event === EVENTS.RESULT)[1];
-
-    expect(
-      wrapper
-        .find('button')
-        .last()
-        .text()
-        .trim()
-    ).toBe('Rerun tests');
-
-    // when
-    onUpdate(axeResult);
 
     // then
-    expect(
-      wrapper
-        .find('button')
-        .last()
-        .text()
-        .trim()
-    ).toBe('Tests completed');
-  });
-
-  it('should request run', () => {
-    // given
-    const api = createApi();
-    const wrapper = mount(<ThemedA11YPanel api={api} active />);
-    const request = api.on.mock.calls.find(([event]) => event === EVENTS.MANUAL)[1];
-
-    expect(
-      wrapper
-        .find('button')
-        .last()
-        .text()
-        .trim()
-    ).toBe('Rerun tests');
     expect(api.emit).not.toHaveBeenCalled();
-
-    // when
-    request();
-
-    // then
-    expect(
-      wrapper
-        .find('button')
-        .last()
-        .text()
-        .trim()
-    ).toBe('Running test');
-    expect(api.emit).toHaveBeenCalledWith(EVENTS.REQUEST);
+    expect(wrapper.text()).toMatch(/Initializing/);
   });
 
-  it('should NOT request run on inactive tab', () => {
+  it('should handle "manual" status', () => {
     // given
     const api = createApi();
-    mount(<ThemedA11YPanel api={api} active={false} />);
-    const request = api.on.mock.calls.find(([event]) => event === EVENTS.MANUAL)[1];
-    expect(api.emit).not.toHaveBeenCalled();
+    const wrapper = mount(<ThemedA11YPanel api={api} active />);
 
     // when
-    request();
+    api.emit(EVENTS.MANUAL, true);
+    wrapper.update();
 
     // then
-    expect(api.emit).not.toHaveBeenCalled();
+    expect(wrapper.text()).toMatch(/Manually run the accessibility scan/);
+    expect(api.emit).not.toHaveBeenCalledWith(EVENTS.REQUEST);
   });
 
-  it('should render report', () => {
+  it('should handle "running" status', () => {
     // given
     const api = createApi();
     const wrapper = mount(<ThemedA11YPanel api={api} active />);
-    const onUpdate = api.on.mock.calls.find(([event]) => event === EVENTS.RESULT)[1];
 
     // when
-    onUpdate(axeResult);
+    api.emit(EVENTS.MANUAL, false);
+    wrapper.update();
 
     // then
-    expect(wrapper.find(A11YPanel)).toMatchSnapshot();
+    expect(wrapper.text()).toMatch(/Please wait while the accessibility scan is running/);
+    expect(api.emit).toHaveBeenCalledWith(EVENTS.REQUEST);
   });
 
-  it("should render loader when it's running", () => {
+  it('should handle "ran" status', () => {
     // given
     const api = createApi();
     const wrapper = mount(<ThemedA11YPanel api={api} active />);
-    const request = api.on.mock.calls.find(([event]) => event === EVENTS.MANUAL)[1];
 
     // when
-    request();
+    api.emit(EVENTS.RESULT, axeResult);
     wrapper.update();
 
     // then
-    expect(wrapper.find('ScrollArea').length).toBe(0);
-    expect(wrapper.find('Loader').length).toBe(1);
-    expect(wrapper.find('ActionBar').length).toBe(1);
-    expect(wrapper.find('Loader')).toMatchSnapshot();
+    expect(
+      wrapper
+        .find('button')
+        .last()
+        .text()
+        .trim()
+    ).toBe('Tests completed');
+    expect(wrapper.find('Tabs').prop('tabs').length).toBe(3);
+    expect(wrapper.find('Tabs').prop('tabs')[0].label.props.children).toEqual([1, ' Violations']);
+    expect(wrapper.find('Tabs').prop('tabs')[1].label.props.children).toEqual([1, ' Passes']);
+    expect(wrapper.find('Tabs').prop('tabs')[2].label.props.children).toEqual([1, ' Incomplete']);
   });
 
-  it('should NOT anything when tab is not active', () => {
+  it('should handle inactive state', () => {
     // given
     const api = createApi();
 
     // when
     const wrapper = mount(<ThemedA11YPanel api={api} active={false} />);
 
     // then
-    expect(wrapper.find('ScrollArea').length).toBe(0);
-    expect(wrapper.find('ActionBar').length).toBe(0);
+    expect(wrapper.text()).toBe('');
+    expect(api.emit).not.toHaveBeenCalled();
   });
 });