From 0d7141dd49809c3815aeb6fc257d4dfe2607d317 Mon Sep 17 00:00:00 2001 From: Dominic Gannaway Date: Fri, 26 Jul 2019 22:47:37 +0100 Subject: [PATCH] [Flare] Fix SSR issue with serializing responders prop (#16227) --- .../__tests__/DOMEventResponderSystem-test.internal.js | 10 ++++++++++ packages/react-dom/src/server/ReactPartialRenderer.js | 8 +++----- 2 files changed, 13 insertions(+), 5 deletions(-) diff --git a/packages/react-dom/src/events/__tests__/DOMEventResponderSystem-test.internal.js b/packages/react-dom/src/events/__tests__/DOMEventResponderSystem-test.internal.js index fa9f971313a17..7efbeaa5f1a5b 100644 --- a/packages/react-dom/src/events/__tests__/DOMEventResponderSystem-test.internal.js +++ b/packages/react-dom/src/events/__tests__/DOMEventResponderSystem-test.internal.js @@ -12,6 +12,7 @@ let React; let ReactFeatureFlags; let ReactDOM; +let ReactDOMServer; let ReactTestRenderer; // FIXME: What should the public API be for setting an event's priority? Right @@ -72,6 +73,7 @@ describe('DOMEventResponderSystem', () => { ReactFeatureFlags.enableFlareAPI = true; React = require('react'); ReactDOM = require('react-dom'); + ReactDOMServer = require('react-dom/server'); container = document.createElement('div'); document.body.appendChild(container); }); @@ -93,6 +95,14 @@ describe('DOMEventResponderSystem', () => { expect(renderer).toMatchRenderedOutput(
Hello world
); }); + it('can render correctly with the ReactDOMServer', () => { + const TestResponder = createEventResponder({}); + const output = ReactDOMServer.renderToString( +
}>Hello world
, + ); + expect(output).toBe(`
Hello world
`); + }); + it('the event responders should fire on click event', () => { let eventResponderFiredCount = 0; let eventLog = []; diff --git a/packages/react-dom/src/server/ReactPartialRenderer.js b/packages/react-dom/src/server/ReactPartialRenderer.js index 2748da7b92ce8..4a1f808caad45 100644 --- a/packages/react-dom/src/server/ReactPartialRenderer.js +++ b/packages/react-dom/src/server/ReactPartialRenderer.js @@ -346,11 +346,6 @@ const RESERVED_PROPS = { suppressHydrationWarning: null, }; -if (enableFlareAPI) { - // $FlowFixMe: Flow doesn't like this, it's temp until we remove the flag anyway - RESERVED_PROPS.responders = null; -} - function createOpenTagMarkup( tagVerbatim: string, tagLowercase: string, @@ -365,6 +360,9 @@ function createOpenTagMarkup( if (!hasOwnProperty.call(props, propKey)) { continue; } + if (enableFlareAPI && propKey === 'responders') { + continue; + } let propValue = props[propKey]; if (propValue == null) { continue;