chore: adding test

react-component · Apr 27, 2018 · 08bfbd0 · 08bfbd0
1 parent e584387
commit 08bfbd0
Show file tree

Hide file tree

Showing 5 changed files with 83 additions and 1 deletion.
diff --git a/src/MenuItem.jsx b/src/MenuItem.jsx
@@ -162,7 +162,7 @@ export class MenuItem extends React.Component {
         role: 'option',
         'aria-selected': props.isSelected,
       };
-    } else if (attrs.role === null) {
+    } else if (props.role === null) {
       // sometimes we want to specify role inside <li/> element
       // <li><a role='menuitem'>Link</a></li> would be a good example
       delete attrs.role;

diff --git a/tests/Menu.spec.js b/tests/Menu.spec.js
@@ -39,6 +39,27 @@ describe('Menu', () => {
     });
   });
 
+  describe('render role listbox', () => {
+    function createMenu() {
+      return (
+        <Menu
+          className="myMenu"
+          openAnimation="fade"
+          role="listbox"
+        >
+          <MenuItem key="1" role="option">1</MenuItem>
+          <MenuItem key="2" role="option">2</MenuItem>
+          <MenuItem key="3" role="option">3</MenuItem>
+        </Menu>
+      );
+    }
+
+    it(`renders menu correctly`, () => {
+      const wrapper = render(createMenu());
+      expect(renderToJson(wrapper)).toMatchSnapshot();
+    });
+  });
+
   it('set activeKey', () => {
     const wrapper = mount(
       <Menu activeKey="1">

diff --git a/tests/MenuItem.spec.js b/tests/MenuItem.spec.js
@@ -112,4 +112,18 @@ describe('MenuItem', () => {
       expect(onClick).toHaveBeenCalledTimes(3);
     });
   });
+
+  describe('overwrite default role', () => {
+    it('should set empty role', () => {
+      const wrapper = shallow(<NakedMenuItem role={null}>test</NakedMenuItem>);
+
+      expect(wrapper.render()).toMatchSnapshot();
+    });
+
+    it('should set specific role', () => {
+      const wrapper = shallow(<NakedMenuItem role="option">test</NakedMenuItem>);
+
+      expect(wrapper.render()).toMatchSnapshot();
+    });
+  });
 });
diff --git a/tests/__snapshots__/Menu.spec.js.snap b/tests/__snapshots__/Menu.spec.js.snap
@@ -267,3 +267,33 @@ exports[`Menu render renders vertical menu correctly 1`] = `
   </li>
 </ul>
 `;
+
+exports[`Menu render role listbox renders menu correctly 1`] = `
+<ul
+  class="rc-menu myMenu rc-menu-root rc-menu-vertical"
+  role="listbox"
+  tabindex="0"
+>
+  <li
+    aria-selected="false"
+    class="rc-menu-item"
+    role="option"
+  >
+    1
+  </li>
+  <li
+    aria-selected="false"
+    class="rc-menu-item"
+    role="option"
+  >
+    2
+  </li>
+  <li
+    aria-selected="false"
+    class="rc-menu-item"
+    role="option"
+  >
+    3
+  </li>
+</ul>
+`;
diff --git a/tests/__snapshots__/MenuItem.spec.js.snap b/tests/__snapshots__/MenuItem.spec.js.snap
@@ -1,5 +1,22 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
+exports[`MenuItem overwrite default role should set empty role 1`] = `
+<li
+  class="undefined-item"
+>
+  test
+</li>
+`;
+
+exports[`MenuItem overwrite default role should set specific role 1`] = `
+<li
+  class="undefined-item"
+  role="option"
+>
+  test
+</li>
+`;
+
 exports[`MenuItem rest props can render all props to sub component 1`] = `
 <ul
   class="rc-menu  rc-menu-root rc-menu-inline"