From 17882ddcb4b21d7670ac8d11a320a51de3f6513c Mon Sep 17 00:00:00 2001 From: Dan Abramov Date: Mon, 13 Nov 2017 14:32:40 +0000 Subject: [PATCH] Don't emit autoFocus={false} attribute on the server --- .../src/__tests__/ReactServerRendering-test.js | 15 +++++++++++++++ .../react-dom/src/shared/HTMLDOMPropertyConfig.js | 6 +++--- 2 files changed, 18 insertions(+), 3 deletions(-) diff --git a/packages/react-dom/src/__tests__/ReactServerRendering-test.js b/packages/react-dom/src/__tests__/ReactServerRendering-test.js index c83c7023072aa..86519ae5854a9 100644 --- a/packages/react-dom/src/__tests__/ReactServerRendering-test.js +++ b/packages/react-dom/src/__tests__/ReactServerRendering-test.js @@ -382,6 +382,21 @@ describe('ReactDOMServer', () => { expect(element.firstChild.focus).not.toHaveBeenCalled(); }); + it('should not focus on either server or client with autofocus={false}', () => { + var element = document.createElement('div'); + element.innerHTML = ReactDOMServer.renderToString( + , + ); + expect(element.firstChild.autofocus).toBe(false); + + element.firstChild.focus = jest.fn(); + ReactDOM.hydrate(, element); + expect(element.firstChild.focus).not.toHaveBeenCalled(); + + ReactDOM.render(, element); + expect(element.firstChild.focus).not.toHaveBeenCalled(); + }); + it('should throw with silly args', () => { expect( ReactDOMServer.renderToString.bind(ReactDOMServer, {x: 123}), diff --git a/packages/react-dom/src/shared/HTMLDOMPropertyConfig.js b/packages/react-dom/src/shared/HTMLDOMPropertyConfig.js index ad38c10f9f636..ef09460238496 100644 --- a/packages/react-dom/src/shared/HTMLDOMPropertyConfig.js +++ b/packages/react-dom/src/shared/HTMLDOMPropertyConfig.js @@ -20,11 +20,11 @@ var HTMLDOMPropertyConfig = { // name warnings. Properties: { allowFullScreen: HAS_BOOLEAN_VALUE, - autoFocus: HAS_STRING_BOOLEAN_VALUE, // specifies target context for links with `preload` type async: HAS_BOOLEAN_VALUE, - // autoFocus is polyfilled/normalized by AutoFocusUtils - // autoFocus: HAS_BOOLEAN_VALUE, + // Note: there is a special case that prevents it from being written to the DOM + // on the client side because the browsers are inconsistent. Instead we call focus(). + autoFocus: HAS_BOOLEAN_VALUE, autoPlay: HAS_BOOLEAN_VALUE, capture: HAS_OVERLOADED_BOOLEAN_VALUE, checked: MUST_USE_PROPERTY | HAS_BOOLEAN_VALUE,