From 9c0e4fc5f9453a5edb48c5b8901dcfc87c6d23e0 Mon Sep 17 00:00:00 2001 From: Kara Erickson Date: Sat, 5 Feb 2022 11:50:02 -0800 Subject: [PATCH] Do not warn when application/ld+json scripts are used with next/head In #33968, a warning was added for script tags inserted through the next/head component. This change unintentionally included application/ld+json scripts, which shouldn't be triggering the warnings (as they were originally intended to catch scripts where loading order or timing could be important). This change adds an exception for application/ld+json scripts, so they do not log the warning if they are included through next/head. --- packages/next/shared/lib/head.tsx | 3 ++- .../pages/head-with-json-ld-snippet.js | 12 ++++++++++ .../client-navigation/test/index.test.js | 23 +++++++++++++++++++ 3 files changed, 37 insertions(+), 1 deletion(-) create mode 100644 test/integration/client-navigation/pages/head-with-json-ld-snippet.js diff --git a/packages/next/shared/lib/head.tsx b/packages/next/shared/lib/head.tsx index 31d86fc503d7c26..81d339e21a9f3c9 100644 --- a/packages/next/shared/lib/head.tsx +++ b/packages/next/shared/lib/head.tsx @@ -162,7 +162,8 @@ function reduceComponents( } } if (process.env.NODE_ENV === 'development') { - if (c.type === 'script') { + // omit JSON-LD structured data snippets from the warning + if (c.type === 'script' && c.props['type'] !== 'application/ld+json') { const srcMessage = c.props['src'] ? ` + +

I can have meta tags

+ +) diff --git a/test/integration/client-navigation/test/index.test.js b/test/integration/client-navigation/test/index.test.js index 06d4bb57f88f67c..42d3906517519b1 100644 --- a/test/integration/client-navigation/test/index.test.js +++ b/test/integration/client-navigation/test/index.test.js @@ -1414,6 +1414,29 @@ describe('Client Navigation', () => { } }) + it('should not warn when application/ld+json scripts are in head', async () => { + let browser + try { + browser = await webdriver(context.appPort, '/head-with-json-ld-snippet') + + await browser.waitForElementByCss('h1') + await waitFor(2000) + const browserLogs = await browser.log('browser') + let found = false + browserLogs.forEach((log) => { + console.log('log.message', log.message) + if (log.message.includes('Use next/script instead')) { + found = true + } + }) + expect(found).toEqual(false) + } finally { + if (browser) { + await browser.close() + } + } + }) + it('should warn when stylesheets are in head', async () => { let browser try {