Deduplication of warn when selected is set on <option> (#11821)

* Deduplication of warn selected on option

- Wrote a failing test
- Deduplication when selected is set on option

* Ran yarn preitter

* Fixed PR request

- Moved dedupe test to above
- Moved && case to seperate if to seperate static and dynamic things
- Render'd component twice

* Actually check for deduplication

* Minor nits

Author: watadarkstar

packages/react-dom/src/__tests__/ReactDOMSelect-test.js

@@ -540,6 +540,7 @@ describe('ReactDOMSelect', () => {
       </select>,
     );
     if (__DEV__) {
+      expect(console.error.calls.count()).toBe(1);
       expect(console.error.calls.argsFor(0)[0]).toContain(
         '`value` prop on `select` should not be null. ' +
           'Consider using an empty string to clear the component or `undefined` ' +
@@ -557,6 +558,34 @@ describe('ReactDOMSelect', () => {
     }
   });
 
+  it('should warn if selected is set on <option>', () => {
+    spyOnDev(console, 'error');
+
+    ReactTestUtils.renderIntoDocument(
+      <select>
+        <option selected={true} />
+        <option selected={true} />
+      </select>,
+    );
+    if (__DEV__) {
+      expect(console.error.calls.count()).toBe(1);
+    }
+
+    ReactTestUtils.renderIntoDocument(
+      <select>
+        <option selected={true} />
+        <option selected={true} />
+      </select>,
+    );
+    if (__DEV__) {
+      expect(console.error.calls.count()).toBe(1);
+      expect(console.error.calls.argsFor(0)[0]).toContain(
+        'Use the `defaultValue` or `value` props on <select> instead of ' +
+          'setting `selected` on <option>.',
+      );
+    }
+  });
+
   it('should warn if value is null and multiple is true', () => {
     spyOnDev(console, 'error');
     ReactTestUtils.renderIntoDocument(

packages/react-dom/src/client/ReactDOMFiberOption.js

@@ -10,6 +10,8 @@
 import React from 'react';
 import warning from 'fbjs/lib/warning';
 
+let didWarnSelectedSetOnOption = false;
+
 function flattenChildren(children) {
   let content = '';
 
@@ -36,11 +38,14 @@ function flattenChildren(children) {
 export function validateProps(element: Element, props: Object) {
   // TODO (yungsters): Remove support for `selected` in <option>.
   if (__DEV__) {
-    warning(
-      props.selected == null,
-      'Use the `defaultValue` or `value` props on <select> instead of ' +
-        'setting `selected` on <option>.',
-    );
+    if (!didWarnSelectedSetOnOption) {
+      warning(
+        props.selected == null,
+        'Use the `defaultValue` or `value` props on <select> instead of ' +
+          'setting `selected` on <option>.',
+      );
+      didWarnSelectedSetOnOption = true;
+    }
   }
 }