{"files":[{"path":"packages\/react-dom\/src\/__tests__\/ReactDOMFragmentRefs-test.js","status":"M"}],"parents":["142cfde89edab3d4eabd6335458b4c8736cebfb6"],"commit":{"authorName":"Sebastian \"Sebbie\" Silbermann","subject":"Fix formatting (#36332)","revision":"561ed529b3a6a16e5b2b76fa5ee86c09f959686c","shortRevision":"561ed529b3","authorEmail":"sebastian.silbermann@vercel.com","authoredAt":"2026-04-23T21:16:35+02:00"},"body":"","patch":"diff --git a\/packages\/react-dom\/src\/__tests__\/ReactDOMFragmentRefs-test.js b\/packages\/react-dom\/src\/__tests__\/ReactDOMFragmentRefs-test.js\nindex 7b41e1a2a8..ae934b914e 100644\n--- a\/packages\/react-dom\/src\/__tests__\/ReactDOMFragmentRefs-test.js\n+++ b\/packages\/react-dom\/src\/__tests__\/ReactDOMFragmentRefs-test.js\n@@ -814,85 +814,79 @@ describe('FragmentRefs', () => {\n expect(logs).toEqual([]);\n });\n \n- \/\/ @gate enableFragmentRefs\n- it(\n- 'removes a capture listener registered with boolean when removed with options object',\n- async () => {\n- const fragmentRef = React.createRef(null);\n- function Test() {\n- return (\n- \n-

\n- <\/Fragment>\n- );\n- }\n- const root = ReactDOMClient.createRoot(container);\n- await act(() => {\n- root.render();\n- });\n+ \/\/ @gate enableFragmentRefs\n+ it('removes a capture listener registered with boolean when removed with options object', async () => {\n+ const fragmentRef = React.createRef(null);\n+ function Test() {\n+ return (\n+ \n+

\n+ <\/Fragment>\n+ );\n+ }\n+ const root = ReactDOMClient.createRoot(container);\n+ await act(() => {\n+ root.render();\n+ });\n \n- const logs = [];\n- function logCapture() {\n- logs.push('capture');\n- }\n+ const logs = [];\n+ function logCapture() {\n+ logs.push('capture');\n+ }\n \n- \/\/ Register with boolean `true` (capture phase)\n- fragmentRef.current.addEventListener('click', logCapture, true);\n- document.querySelector('#child-a').click();\n- expect(logs).toEqual(['capture']);\n+ \/\/ Register with boolean `true` (capture phase)\n+ fragmentRef.current.addEventListener('click', logCapture, true);\n+ document.querySelector('#child-a').click();\n+ expect(logs).toEqual(['capture']);\n \n- logs.length = 0;\n+ logs.length = 0;\n \n- \/\/ Remove with equivalent options object {capture: true}\n- \/\/ Per DOM spec, these are identical - the listener MUST be removed\n- fragmentRef.current.removeEventListener('click', logCapture, {\n- capture: true,\n- });\n- document.querySelector('#child-a').click();\n- \/\/ Listener should have been removed - logs must remain empty\n- expect(logs).toEqual([]);\n- },\n- );\n+ \/\/ Remove with equivalent options object {capture: true}\n+ \/\/ Per DOM spec, these are identical - the listener MUST be removed\n+ fragmentRef.current.removeEventListener('click', logCapture, {\n+ capture: true,\n+ });\n+ document.querySelector('#child-a').click();\n+ \/\/ Listener should have been removed - logs must remain empty\n+ expect(logs).toEqual([]);\n+ });\n \n- \/\/ @gate enableFragmentRefs\n- it(\n- 'removes a capture listener registered with options object when removed with boolean',\n- async () => {\n- const fragmentRef = React.createRef(null);\n- function Test() {\n- return (\n- \n-

\n- <\/Fragment>\n- );\n- }\n- const root = ReactDOMClient.createRoot(container);\n- await act(() => {\n- root.render();\n- });\n+ \/\/ @gate enableFragmentRefs\n+ it('removes a capture listener registered with options object when removed with boolean', async () => {\n+ const fragmentRef = React.createRef(null);\n+ function Test() {\n+ return (\n+ \n+

\n+ <\/Fragment>\n+ );\n+ }\n+ const root = ReactDOMClient.createRoot(container);\n+ await act(() => {\n+ root.render();\n+ });\n \n- const logs = [];\n- function logCapture() {\n- logs.push('capture');\n- }\n+ const logs = [];\n+ function logCapture() {\n+ logs.push('capture');\n+ }\n \n- \/\/ Register with options object {capture: true}\n- fragmentRef.current.addEventListener('click', logCapture, {\n- capture: true,\n- });\n- document.querySelector('#child-b').click();\n- expect(logs).toEqual(['capture']);\n+ \/\/ Register with options object {capture: true}\n+ fragmentRef.current.addEventListener('click', logCapture, {\n+ capture: true,\n+ });\n+ document.querySelector('#child-b').click();\n+ expect(logs).toEqual(['capture']);\n \n- logs.length = 0;\n+ logs.length = 0;\n \n- \/\/ Remove with boolean `true`\n- \/\/ Per DOM spec, these are identical - the listener MUST be removed\n- fragmentRef.current.removeEventListener('click', logCapture, true);\n- document.querySelector('#child-b').click();\n- \/\/ Listener should have been removed - logs must remain empty\n- expect(logs).toEqual([]);\n- },\n- );\n+ \/\/ Remove with boolean `true`\n+ \/\/ Per DOM spec, these are identical - the listener MUST be removed\n+ fragmentRef.current.removeEventListener('click', logCapture, true);\n+ document.querySelector('#child-b').click();\n+ \/\/ Listener should have been removed - logs must remain empty\n+ expect(logs).toEqual([]);\n+ });\n \n \/\/ @gate enableFragmentRefs\n it('applies event listeners to portaled children', async () => {\n@@ -2762,87 +2756,81 @@ describe('FragmentRefs', () => {\n });\n \n \/\/ @gate enableFragmentRefs\n- it(\n- 'treats passive:true and passive:false as same listener per DOM spec',\n- async () => {\n- const fragmentRef = React.createRef();\n- const root = ReactDOMClient.createRoot(container);\n-\n- await act(() => {\n- root.render(\n- \n-

\n- <\/Fragment>,\n- );\n- });\n-\n- const logs = [];\n- const handler = () => logs.push('fired');\n-\n- const child = document.querySelector('#child');\n- const spy = jest.spyOn(child, 'addEventListener');\n- \/\/ Per DOM spec, listener identity is (type, callback, capture).\n- \/\/ passive is NOT part of the key, so these are the SAME listener.\n- fragmentRef.current.addEventListener('click', handler, {passive: false});\n- \/\/ Second add is a no-op: same (type, callback, capture) identity.\n- fragmentRef.current.addEventListener('click', handler, {passive: true});\n- expect(spy).toHaveBeenCalledTimes(1);\n- expect(spy).toHaveBeenCalledWith('click', handler, {passive: false});\n+ it('treats passive:true and passive:false as same listener per DOM spec', async () => {\n+ const fragmentRef = React.createRef();\n+ const root = ReactDOMClient.createRoot(container);\n \n- document.querySelector('#child').click();\n- \/\/ First handler fires once (second add was a no-op).\n- expect(logs).toEqual(['fired']);\n+ await act(() => {\n+ root.render(\n+ \n+

\n+ <\/Fragment>,\n+ );\n+ });\n \n- \/\/ removeEventListener also ignores passive when matching\n- fragmentRef.current.removeEventListener('click', handler, {\n- passive: true,\n- });\n+ const logs = [];\n+ const handler = () => logs.push('fired');\n+\n+ const child = document.querySelector('#child');\n+ const spy = jest.spyOn(child, 'addEventListener');\n+ \/\/ Per DOM spec, listener identity is (type, callback, capture).\n+ \/\/ passive is NOT part of the key, so these are the SAME listener.\n+ fragmentRef.current.addEventListener('click', handler, {passive: false});\n+ \/\/ Second add is a no-op: same (type, callback, capture) identity.\n+ fragmentRef.current.addEventListener('click', handler, {passive: true});\n+ expect(spy).toHaveBeenCalledTimes(1);\n+ expect(spy).toHaveBeenCalledWith('click', handler, {passive: false});\n+\n+ document.querySelector('#child').click();\n+ \/\/ First handler fires once (second add was a no-op).\n+ expect(logs).toEqual(['fired']);\n+\n+ \/\/ removeEventListener also ignores passive when matching\n+ fragmentRef.current.removeEventListener('click', handler, {\n+ passive: true,\n+ });\n \n- logs.length = 0;\n- document.querySelector('#child').click();\n- expect(logs).toEqual([]);\n- },\n- );\n+ logs.length = 0;\n+ document.querySelector('#child').click();\n+ expect(logs).toEqual([]);\n+ });\n \/\/ @gate enableFragmentRefs\n- it(\n- 'removes a listener registered with passive:false when removed with passive:true',\n- async () => {\n- const fragmentRef = React.createRef(null);\n- function Test() {\n- return (\n- <>\n-

\n- <\/>\n- );\n- }\n- const root = ReactDOMClient.createRoot(container);\n- await act(() => {\n- root.render(\n- \n- \n- <\/Fragment>,\n- );\n- });\n- const logs = [];\n- function handler() {\n- logs.push('fired');\n- }\n- \/\/ Register with passive: false\n- fragmentRef.current.addEventListener('click', handler, {\n- passive: false,\n- });\n- document.querySelector('#child-x').click();\n- expect(logs).toEqual(['fired']);\n- logs.length = 0;\n- \/\/ Remove with passive: true - per DOM spec, passive is NOT part of identity\n- \/\/ so this MUST remove the listener regardless of passive mismatch.\n- fragmentRef.current.removeEventListener('click', handler, {\n- passive: true,\n- });\n- document.querySelector('#child-x').click();\n- \/\/ Listener removed - no more invocations\n- expect(logs).toEqual([]);\n- },\n- );\n+ it('removes a listener registered with passive:false when removed with passive:true', async () => {\n+ const fragmentRef = React.createRef(null);\n+ function Test() {\n+ return (\n+ <>\n+

\n+ <\/>\n+ );\n+ }\n+ const root = ReactDOMClient.createRoot(container);\n+ await act(() => {\n+ root.render(\n+ \n+ \n+ <\/Fragment>,\n+ );\n+ });\n+ const logs = [];\n+ function handler() {\n+ logs.push('fired');\n+ }\n+ \/\/ Register with passive: false\n+ fragmentRef.current.addEventListener('click', handler, {\n+ passive: false,\n+ });\n+ document.querySelector('#child-x').click();\n+ expect(logs).toEqual(['fired']);\n+ logs.length = 0;\n+ \/\/ Remove with passive: true - per DOM spec, passive is NOT part of identity\n+ \/\/ so this MUST remove the listener regardless of passive mismatch.\n+ fragmentRef.current.removeEventListener('click', handler, {\n+ passive: true,\n+ });\n+ document.querySelector('#child-x').click();\n+ \/\/ Listener removed - no more invocations\n+ expect(logs).toEqual([]);\n+ });\n });\n });\n"}

dillon1000/react

Files changed