diff --git a/packages/next/next-server/lib/head.tsx b/packages/next/next-server/lib/head.tsx
index bd5e6e7e78da1..bee5242e0c3b1 100644
--- a/packages/next/next-server/lib/head.tsx
+++ b/packages/next/next-server/lib/head.tsx
@@ -72,6 +72,12 @@ function unique() {
keys.add(h.key)
return true
}
+
+ // If custom meta tag has been added the key will be prepended with `.$`, we can
+ // check for this and dedupe in favor of the custom one, so the default
+ // is not rendered as well
+ if (keys.has(`.$${h.key}`)) return false
+
switch (h.type) {
case 'title':
case 'base':
diff --git a/test/integration/client-navigation/pages/head-duplicate-default-keys.js b/test/integration/client-navigation/pages/head-duplicate-default-keys.js
new file mode 100644
index 0000000000000..7b9b123011095
--- /dev/null
+++ b/test/integration/client-navigation/pages/head-duplicate-default-keys.js
@@ -0,0 +1,23 @@
+import React from 'react'
+import Head from 'next/head'
+
+export default () => (
+
+
+ {/* this will not render */}
+
+ {/* this will override the default (same key as the default) */}
+
+
+ {/* this will not render */}
+
+ {/* this will override the default (same key as the default) */}
+
+
+
Meta tags with same keys as default get deduped
+
+)
diff --git a/test/integration/client-navigation/pages/head.js b/test/integration/client-navigation/pages/head.js
index 897e245e7ed1d..2f4a26b988def 100644
--- a/test/integration/client-navigation/pages/head.js
+++ b/test/integration/client-navigation/pages/head.js
@@ -9,7 +9,7 @@ export default () => (
{/* this will get rendered */}
- {/* this not render */}
+ {/* this will not render */}
{/* this will override the default */}
diff --git a/test/integration/client-navigation/test/rendering.js b/test/integration/client-navigation/test/rendering.js
index 5ff6a2c02dc76..f41f200308f80 100644
--- a/test/integration/client-navigation/test/rendering.js
+++ b/test/integration/client-navigation/test/rendering.js
@@ -82,6 +82,16 @@ export default function (render, fetch) {
)
})
+ test('header helper dedupes tags with the same key as the default', async () => {
+ const html = await render('/head')
+ expect(html).toContain('')
+ expect(html).not.toContain('')
+ expect(html).toContain(
+ ''
+ )
+ expect(html).not.toContain('')
+ })
+
test('header helper avoids dedupe of specific tags', async () => {
const html = await render('/head')
expect(html).toContain('')