Description
Verify canary release
- I verified that the issue exists in Next.js canary release
Provide environment information
Operating System:
Platform: darwin
Arch: x64
Version: Darwin Kernel Version 20.6.0: Tue Feb 22 21:10:41 PST 2022; root:xnu-7195.141.26~1/RELEASE_X86_64
Binaries:
Node: 14.15.1
npm: 6.14.16
Yarn: 1.22.4
pnpm: N/A
Relevant packages:
next: 12.1.4
react: 18.0.0
react-dom: 18.0.0
What browser are you using? (if relevant)
Chrome
How are you deploying your application? (if relevant)
Vercel
Describe the Bug
In deployed environment on Vercel: I see comment tags <!-- --> added in the HTML title when i place <title> inside <Head> in next/document. This doesn't seem to happen on local.
<title>My title here<!-- --></title>
I do see the warning that:
"Titles should be defined at the page-level using next/head. See: https://nextjs.org/docs/messages/no-title-in-document-head"
I have since moved the global title to _app.tsx using next/head but wondering if this is still expected behavior
here's what i have in my _document.tsx.
import Document, { Html, Head, Main, NextScript } from "next/document";
class MyDocument extends Document {
render() {
return (
<Html>
<Head>
<title>My title here</title>
<meta
name="description"
content="Random description"
/>
</Head>
<body>
<Main />
<NextScript />
</body>
</Html>
);
}
}
export default MyDocument;Expected Behavior
I should see regular title without comment tags
<title>My title here</title>To Reproduce
Use the following in your _document.tsx
import Document, { Html, Head, Main, NextScript } from "next/document";
class MyDocument extends Document {
render() {
return (
<Html>
<Head>
<title>My title here</title>
<meta
name="description"
content="Random description"
/>
</Head>
<body>
<Main />
<NextScript />
</body>
</Html>
);
}
}
export default MyDocument;