From 5198cb8b0b28cc0d5dce9c44f3f4101ebf27d478 Mon Sep 17 00:00:00 2001 From: Lior Kovtun Date: Fri, 26 Dec 2025 11:14:44 +0200 Subject: [PATCH 1/4] fix: Handle unhandled promise rejection in stylesheet loading --- .../react-dom-bindings/src/client/ReactFiberConfigDOM.js | 6 +++--- packages/react-dom/src/__tests__/ReactDOMFloat-test.js | 5 ++--- 2 files changed, 5 insertions(+), 6 deletions(-) diff --git a/packages/react-dom-bindings/src/client/ReactFiberConfigDOM.js b/packages/react-dom-bindings/src/client/ReactFiberConfigDOM.js index 66e46961d81..2b3aa55428c 100644 --- a/packages/react-dom-bindings/src/client/ReactFiberConfigDOM.js +++ b/packages/react-dom-bindings/src/client/ReactFiberConfigDOM.js @@ -4944,7 +4944,7 @@ function preinitStyle( (link: any)._p = new Promise((resolve, reject) => { link.onload = resolve; link.onerror = reject; - }); + }).catch(() => {}); link.addEventListener('load', () => { state.loading |= Loaded; }); @@ -5467,7 +5467,7 @@ export function acquireResource( (linkInstance: any)._p = new Promise((resolve, reject) => { linkInstance.onload = resolve; linkInstance.onerror = reject; - }); + }).catch(() => {}); setInitialProperties(instance, 'link', stylesheetProps); resource.state.loading |= Inserted; insertStylesheet(instance, qualifiedProps.precedence, hoistableRoot); @@ -6170,7 +6170,7 @@ export function suspendResource( (linkInstance: any)._p = new Promise((resolve, reject) => { linkInstance.onload = resolve; linkInstance.onerror = reject; - }); + }).catch(() => {}); setInitialProperties(instance, 'link', stylesheetProps); resource.instance = instance; } diff --git a/packages/react-dom/src/__tests__/ReactDOMFloat-test.js b/packages/react-dom/src/__tests__/ReactDOMFloat-test.js index 848fdd65219..4fc92132e8b 100644 --- a/packages/react-dom/src/__tests__/ReactDOMFloat-test.js +++ b/packages/react-dom/src/__tests__/ReactDOMFloat-test.js @@ -3082,8 +3082,7 @@ body { ); }); - // eslint-disable-next-line jest/no-disabled-tests - it.skip('can delay commit until css resources error', async () => { + it('can delay commit until css resources error', async () => { // TODO: This test fails and crashes jest. need to figure out why before unskipping. const root = ReactDOMClient.createRoot(container); expect(getMeaningfulChildren(container)).toBe(undefined); @@ -3105,7 +3104,7 @@ body { loadPreloads(['foo']); errorPreloads(['bar']); - assertLog(['load preload: foo', 'error preload: bar']); + assertLog(['error preload: bar', 'load preload: foo']); // We expect that the stylesheet is inserted now but the commit has not happened yet. expect(getMeaningfulChildren(container)).toBe(undefined); From b88f3f3a12c4070d9f5ee81762ff308279ee521b Mon Sep 17 00:00:00 2001 From: Lior Kovtun Date: Fri, 26 Dec 2025 11:27:55 +0200 Subject: [PATCH 2/4] Fix test --- packages/react-dom/src/__tests__/ReactDOMFloat-test.js | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/packages/react-dom/src/__tests__/ReactDOMFloat-test.js b/packages/react-dom/src/__tests__/ReactDOMFloat-test.js index 4fc92132e8b..feced253630 100644 --- a/packages/react-dom/src/__tests__/ReactDOMFloat-test.js +++ b/packages/react-dom/src/__tests__/ReactDOMFloat-test.js @@ -3083,7 +3083,6 @@ body { }); it('can delay commit until css resources error', async () => { - // TODO: This test fails and crashes jest. need to figure out why before unskipping. const root = ReactDOMClient.createRoot(container); expect(getMeaningfulChildren(container)).toBe(undefined); React.startTransition(() => { @@ -3118,7 +3117,7 @@ body { errorStylesheets(['bar']); loadStylesheets(['foo']); - assertLog(['load stylesheet: foo', 'error stylesheet: bar']); + assertLog(['load preload: foo', 'error preload: bar']); // We expect that the commit finishes synchronously after the stylesheet loads. expect(getMeaningfulChildren(container)).toEqual(
hello
); From 03587bd050c380359704c541656968f7dfab7ab0 Mon Sep 17 00:00:00 2001 From: Lior Kovtun Date: Fri, 26 Dec 2025 11:30:30 +0200 Subject: [PATCH 3/4] Fix test --- packages/react-dom/src/__tests__/ReactDOMFloat-test.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/react-dom/src/__tests__/ReactDOMFloat-test.js b/packages/react-dom/src/__tests__/ReactDOMFloat-test.js index feced253630..1fa5f71960d 100644 --- a/packages/react-dom/src/__tests__/ReactDOMFloat-test.js +++ b/packages/react-dom/src/__tests__/ReactDOMFloat-test.js @@ -3103,7 +3103,7 @@ body { loadPreloads(['foo']); errorPreloads(['bar']); - assertLog(['error preload: bar', 'load preload: foo']); + assertLog(['load preload: foo', 'error preload: bar']); // We expect that the stylesheet is inserted now but the commit has not happened yet. expect(getMeaningfulChildren(container)).toBe(undefined); From ceb4baa7301a1914ec4edd9d5d7afaa6a43076fd Mon Sep 17 00:00:00 2001 From: Lior Kovtun Date: Fri, 26 Dec 2025 11:37:51 +0200 Subject: [PATCH 4/4] Fix test --- packages/react-dom/src/__tests__/ReactDOMFloat-test.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/react-dom/src/__tests__/ReactDOMFloat-test.js b/packages/react-dom/src/__tests__/ReactDOMFloat-test.js index 1fa5f71960d..6428266af98 100644 --- a/packages/react-dom/src/__tests__/ReactDOMFloat-test.js +++ b/packages/react-dom/src/__tests__/ReactDOMFloat-test.js @@ -3117,7 +3117,7 @@ body { errorStylesheets(['bar']); loadStylesheets(['foo']); - assertLog(['load preload: foo', 'error preload: bar']); + assertLog(['error stylesheet: bar', 'load stylesheet: foo']); // We expect that the commit finishes synchronously after the stylesheet loads. expect(getMeaningfulChildren(container)).toEqual(
hello
);