Merge pull request #16 from FBerthelot/dispatchEventImprove

🎨 improve dispatchEvent string case
FBerthelot · May 26, 2019 · d35c09f · d35c09f
2 parents 1dd1f57 + b6fa7a1
commit d35c09f
Show file tree

Hide file tree

Showing 3 changed files with 13 additions and 9 deletions.
diff --git a/packages/component-test-utils-react/src/__tests__/shallow-dispatchEvent.spec.js b/packages/component-test-utils-react/src/__tests__/shallow-dispatchEvent.spec.js
@@ -14,7 +14,7 @@ describe('shallow - trigger/dispatchEvent', () => {
 
     const cmp = shallow(<Component/>);
 
-    cmp.trigger('Click');
+    cmp.trigger('click');
 
     expect(cmp.html()).toBe(
       '<button type="button" onClick="[onClick]">1</button>'
@@ -33,7 +33,7 @@ describe('shallow - trigger/dispatchEvent', () => {
 
     const cmp = shallow(<Component/>);
 
-    cmp.dispatchEvent('Click');
+    cmp.dispatchEvent('click');
 
     expect(cmp.html()).toBe(
       '<button type="button" onClick="[onClick]">1</button>'
@@ -64,7 +64,7 @@ describe('shallow - trigger/dispatchEvent', () => {
     }
 
     const cmp = shallow(<Component/>);
-    cmp.dispatchEvent('Click');
+    cmp.dispatchEvent('click');
 
     expect(cmp.html()).toBe(
       '<button type="button" onClick="[bound handleClick]">42</button>'
@@ -98,7 +98,7 @@ describe('shallow - trigger/dispatchEvent', () => {
 
     const cmp = shallow(<Component/>);
 
-    cmp.dispatchEvent('Click');
+    cmp.dispatchEvent('click');
 
     expect(cmp.html()).toBe(
       '<button type="button" onClick="[bound handleClick]">1</button>'
@@ -125,7 +125,7 @@ describe('shallow - trigger/dispatchEvent', () => {
 
     const cmp = shallow(<Component/>);
 
-    cmp.dispatchEvent('Click');
+    cmp.dispatchEvent('click');
 
     expect(cmp.html()).toBe(
       '<button type="button" onClick="[onClick]">4 - 7</button>'

diff --git a/packages/component-test-utils-react/src/methods/dispatchEvent.js b/packages/component-test-utils-react/src/methods/dispatchEvent.js
@@ -1,7 +1,11 @@
 const {getHtml} = require('./html');
 
 exports.dispatchEvent = (reactTree, eventName) => {
-  if (!reactTree.props[`on${eventName}`]) {
+  const eventNameCaseOk = `${eventName
+    .charAt(0)
+    .toUpperCase()}${eventName.slice(1)}`;
+
+  if (!reactTree.props[`on${eventNameCaseOk}`]) {
     throw new Error(
       `Cannot dispatch event "${eventName}" on this node : ${getHtml({
         ...reactTree,
@@ -13,5 +17,5 @@ exports.dispatchEvent = (reactTree, eventName) => {
     );
   }
 
-  reactTree.props[`on${eventName}`]();
+  reactTree.props[`on${eventNameCaseOk}`]();
 };
diff --git a/website/docs/shallow/dispatchEvent.md b/website/docs/shallow/dispatchEvent.md
@@ -22,8 +22,8 @@ const Component = () => {
 
 const cmp = shallow(<Component />);
 
-cmp.dispatchEvent('Click');
-// cmp.trigger('Click'); is equivalent
+cmp.dispatchEvent('click');
+// cmp.trigger('click'); is equivalent
 
 expect(cmp.html()).toBe('<button type="button" onClick="[onClick]">1</button>');
 ```