From 51e3f498a20572ecd5360c0460da212903a089bb Mon Sep 17 00:00:00 2001
From: Adrian Carolli <adrian.caarolli@gmail.com>
Date: Sat, 9 Dec 2017 21:06:41 -0500
Subject: [PATCH] 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
---
 .../src/__tests__/ReactDOMSelect-test.js      | 29 +++++++++++++++++++
 .../src/client/ReactDOMFiberOption.js         | 15 ++++++----
 2 files changed, 39 insertions(+), 5 deletions(-)

diff --git a/packages/react-dom/src/__tests__/ReactDOMSelect-test.js b/packages/react-dom/src/__tests__/ReactDOMSelect-test.js
index c3c7de9a93..198e142d4b 100644
--- a/packages/react-dom/src/__tests__/ReactDOMSelect-test.js
+++ b/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(
diff --git a/packages/react-dom/src/client/ReactDOMFiberOption.js b/packages/react-dom/src/client/ReactDOMFiberOption.js
index 63151ad0d9..834733e772 100644
--- a/packages/react-dom/src/client/ReactDOMFiberOption.js
+++ b/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;
+    }
   }
 }