Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

not-found.js doesn't read metadata #50566

Closed
1 task done
lewisking opened this issue May 31, 2023 · 12 comments
Closed
1 task done

not-found.js doesn't read metadata #50566

lewisking opened this issue May 31, 2023 · 12 comments
Labels
area: app App directory (appDir: true) bug Issue was opened via the bug report template. locked

Comments

@lewisking
Copy link

Verify canary release

  • I verified that the issue exists in the latest Next.js canary release

Provide environment information

Operating System:
      Platform: darwin
      Arch: arm64
      Version: Darwin Kernel Version 22.6.0: Mon May  8 23:12:01 PDT 2023; root:xnu-8796.140.12.505.1~5/RELEASE_ARM64_T6000
    Binaries:
      Node: 16.13.0
      npm: 8.1.0
      Yarn: 1.22.11
      pnpm: N/A
    Relevant packages:
      next: 13.4.5-canary.2
      eslint-config-next: 13.4.4
      react: 18.2.0
      react-dom: 18.2.0
      typescript: 5.0.4

Which area(s) of Next.js are affected? (leave empty if unsure)

App directory (appDir: true)

Link to the code that reproduces this issue or a replay of the bug

https://github.com/lewisking/next-js-not-found-issue

To Reproduce

Visit localhost:3000/example-404, note that the browser title isn't set.

Describe the Bug

The browser title isn't set, which makes me believe the metadata export is ignored on not-found.js

Expected Behavior

I would expect the metadata export to be respected.

Which browser are you using? (if relevant)

No response

How are you deploying your application? (if relevant)

No response
@lewisking lewisking added the bug Issue was opened via the bug report template. label May 31, 2023
@github-actions github-actions bot added the area: app App directory (appDir: true) label May 31, 2023
@JesseKoldewijn
Copy link
Contributor

I don't know for sure why it both doesn't read the metadata and just keeps refreshing every 4 seconds (in dev) but my workaround for the title not changing bit on the not-found page is by just returning something like this:

<html>
    <head>
        <title>404 - acme</title>
    </head>
    <body>
    <main>404 | not found</main>
    </body>
</html>

@MRezaSafari
Copy link

using @JesseKoldewijn solution can mess up the layout. ( if you have a RootLayout )

and then if you just have a head with a title in it. you will receive this error after routing

image

@JesseKoldewijn
Copy link
Contributor

I can the before mentioned work-around both just now on the latest canary and have been using this for a couple of months already as well. I'll create a reproduction for ya 👍

@JesseKoldewijn
Copy link
Contributor

I've created a fork with the work-around for ya and thrown in in a PR on your reproduction repo so you can easily see the differences. 👍

@JesseKoldewijn
Copy link
Contributor

using @JesseKoldewijn solution can mess up the layout. ( if you have a RootLayout )

and then if you just have a head with a title in it. you will receive this error after routing

image

Seems like an unrelated issue. I got a repro where I both tested having a layout with a title and without it. Not sure where you managed to get this error but it doesn't seem to relate to this work-around I've been using in multiple projects for the past weeks.

@lewisking
Copy link
Author

lewisking commented Jun 1, 2023 •
edited
Loading

Thanks @JesseKoldewijn, but I get errors in console when I set the HTML element within the not-found file. I'm also of the mindset I should be setting that only once in this project to be honest!
Screenshot 2023-06-01 at 09 28 16

@JesseKoldewijn
Copy link
Contributor

Thanks @JesseKoldewijn, but I get errors in console when I set the HTML element within the not-found file. I'm also of the mindset I should be setting that only once in this project to be honest! Screenshot 2023-06-01 at 09 28 16

The html and head element need to match the elements in your layout tho.
See example of how I've been working around this matter in this repo: https://github.com/JesseKoldewijn/next-js-not-found-issue

@lewisking
Copy link
Author

Thanks @JesseKoldewijn, but I get errors in console when I set the HTML element within the not-found file. I'm also of the mindset I should be setting that only once in this project to be honest! Screenshot 2023-06-01 at 09 28 16

The html and head element need to match the elements in your layout tho. See example of how I've been working around this matter in this repo: https://github.com/JesseKoldewijn/next-js-not-found-issue

Gotcha. Still, would expect it to take from the metadata export and not need this workaround, so I'll leave this open

@JesseKoldewijn
Copy link
Contributor

Yeah man I agree it is supposed to work as expected. Just wanted to share my work-around as more of a short-term fix 😉

@shuding
Copy link
Member

shuding commented Jun 3, 2023

Related discussions in #45620.

@huozhi
Copy link
Member

huozhi commented Aug 26, 2023

Close this as duplicate, let's track in #45620

@huozhi huozhi closed this as completed Aug 26, 2023
@github-actions
Copy link
Contributor

This closed issue has been automatically locked because it had no new activity for 2 weeks. If you are running into a similar issue, please create a new issue with the steps to reproduce. Thank you.

@github-actions github-actions bot locked as resolved and limited conversation to collaborators Sep 10, 2023
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Assignees
No one assigned
Labels
area: app App directory (appDir: true) bug Issue was opened via the bug report template. locked
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
5 participants
@lewisking @MRezaSafari @shuding @huozhi @JesseKoldewijn