Changed warning message to handle true and false boolean values. #3

NicBonetto · Oct 24, 2017 · 449b98d · 449b98d
1 parent 3d4724e
commit 449b98d
Show file tree

Hide file tree

Showing 3 changed files with 24 additions and 21 deletions.
diff --git a/packages/react-dom/src/__tests__/ReactDOMAttribute-test.js b/packages/react-dom/src/__tests__/ReactDOMAttribute-test.js
@@ -54,9 +54,8 @@ describe('ReactDOM unknown attribute', () => {
       expectDev(
         normalizeCodeLocInfo(console.error.calls.argsFor(0)[0]),
       ).toMatch(
-        'Warning: If you intentionally tried to pass a boolean, pass it as a string ' +
-          'instead: `true`="`unknown`". If you mean to conditionally pass an ' +
-          'attribute, use a ternary expression: `true`={condition ? value : null}.\n' +
+        'Warning: Received `true` for non-boolean attribute `unknown`. If this is expected, cast ' +
+          'the value to a string.\n' +
           '    in div (at **)',
       );
       expectDev(console.error.calls.count()).toBe(1);

diff --git a/packages/react-dom/src/__tests__/ReactDOMComponent-test.js b/packages/react-dom/src/__tests__/ReactDOMComponent-test.js
@@ -2042,9 +2042,8 @@ describe('ReactDOMComponent', () => {
       expect(el.hasAttribute('whatever')).toBe(false);
 
       expectDev(console.error.calls.argsFor(0)[0]).toContain(
-        'If you intentionally tried to pass a boolean, pass it as a string ' +
-          'instead: `true`="`whatever`". If you mean to conditionally pass an ' +
-          'attribute, use a ternary expression: `true`={condition ? value : null}.',
+        'Received `true` for non-boolean attribute `whatever`. If this is expected, cast ' +
+          'the value to a string.',
       );
     });
 
@@ -2057,9 +2056,8 @@ describe('ReactDOMComponent', () => {
       expect(el.hasAttribute('whatever')).toBe(false);
 
       expectDev(console.error.calls.argsFor(0)[0]).toContain(
-        'If you intentionally tried to pass a boolean, pass it as a string ' +
-          'instead: `true`="`whatever`". If you mean to conditionally pass an ' +
-          'attribute, use a ternary expression: `true`={condition ? value : null}.',
+        'Received `true` for non-boolean attribute `whatever`. If this is expected, cast ' +
+          'the value to a string.',
       );
     });
 
@@ -2234,9 +2232,8 @@ describe('ReactDOMComponent', () => {
       expect(el.hasAttribute('whatever')).toBe(false);
 
       expectDev(console.error.calls.argsFor(0)[0]).toContain(
-        'If you intentionally tried to pass a boolean, pass it as a string ' +
-          'instead: `true`="`whatever`". If you mean to conditionally pass an ' +
-          'attribute, use a ternary expression: `true`={condition ? value : null}.',
+        'Received `true` for non-boolean attribute `whatever`. If this is expected, cast ' +
+          'the value to a string.',
       );
     });
 
@@ -2289,9 +2286,9 @@ describe('ReactDOMComponent', () => {
 
       expectDev(console.error.calls.count()).toBe(1);
       expectDev(console.error.calls.argsFor(0)[0]).toContain(
-        'If you intentionally tried to pass a boolean, pass it as a string ' +
-          'instead: `false`="`whatever`". If you mean to conditionally pass an ' +
-          'attribute, use a ternary expression: `false`={condition ? value : null}.',
+        'If you mean to conditionally pass an attribute, use a ternary ' +
+          'expression: `false`={condition ? value : null} instead of ' +
+          '{condition && value}.',
       );
     });
   });

diff --git a/packages/react-dom/src/shared/ReactDOMUnknownPropertyHook.js b/packages/react-dom/src/shared/ReactDOMUnknownPropertyHook.js
@@ -180,19 +180,26 @@ if (__DEV__) {
       return true;
     }
 
-    if (typeof value === 'boolean') {
+    if (typeof value === 'boolean' && value === false) {
       warning(
         DOMProperty.shouldAttributeAcceptBooleanValue(name),
-        'If you intentionally tried to pass a boolean, pass it as a string ' +
-          'instead: `%s`="`%s`". If you mean to conditionally pass an ' +
-          'attribute, use a ternary expression: `%s`={condition ? value : null}.%s',
-        value,
-        name,
+        'If you mean to conditionally pass an attribute, use a ternary ' +
+          'expression: `%s`={condition ? value : undefined} instead of ' +
+          '{condition && value}.%s',
         value,
         getStackAddendum(),
       );
       warnedProperties[name] = true;
       return true;
+    } else if (typeof value === 'boolean') {
+      warning(
+        DOMProperty.shouldAttributeAcceptBooleanValue(name),
+        'Received `%s` for non-boolean attribute `%s`. If this is expected, cast ' +
+          'the value to a string.%s',
+        value,
+        name,
+        getStackAddendum(),
+      );
     }
 
     // Now that we've validated casing, do not validate