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

Usage of styled-jsx with next/jest prints a warning message #34492

Closed
1 task done
theoludwig opened this issue Feb 17, 2022 · 5 comments
Closed
1 task done

Usage of styled-jsx with next/jest prints a warning message #34492

theoludwig opened this issue Feb 17, 2022 · 5 comments
Labels
Testing Related to testing with Next.js.

Comments

@theoludwig
Copy link
Contributor

Verify canary release

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

Provide environment information

Operating System:
  Platform: linux
  Arch: x64
  Version: #31-Ubuntu SMP Thu Jan 13 17:41:06 UTC 2022
Binaries:
  Node: 16.14.0
  npm: 8.4.1
  Yarn: N/A
  pnpm: N/A
Relevant packages:
  next: 12.1.0
  react: 17.0.2
  react-dom: 17.0.2

What browser are you using? (if relevant)

No response

How are you deploying your application? (if relevant)

No response

Describe the Bug

This issue has already been discussed here: #31152 (comment)

With the arrival of next@12.1.0, it seems like next/jest is no longer experimental: https://nextjs.org/blog/next-12-1#zero-configuration-jest-plugin so now it might make sense to open individual issues instead of continuing to discuss on "next/jest feedback" discussion thread for easier tracking.

The issue is that there is a warning message when testing a component that uses styled-jsx with next/jest.
It makes tests output noisy but not dramatic as it is working.

image

Expected Behavior

No warning message, tests run normally.

To Reproduce

  1. npx create-next-app@12.1.0 --example with-jest with-jest-app (using with-jest example)
  2. Replace the content of pages/index.tsx file with:
import type { NextPage } from 'next'
import Head from 'next/head'

const Home: NextPage = () => {
  return (
    <>
      <Head>
        <title>Create Next App</title>
        <link rel='icon' href='/favicon.ico' />
      </Head>

      <main>
        <h1>
          Welcome to <a href='https://nextjs.org'>Next.js!</a>
        </h1>
      </main>

      <style jsx>{`
        h1 {
          color: red;
        }
      `}</style>
    </>
  )
}

export default Home
  1. npm run test:ci or npm run test
@theoludwig theoludwig added the bug Issue was opened via the bug report template. label Feb 17, 2022
@balazsorban44 balazsorban44 added Testing Related to testing with Next.js. kind: bug and removed bug Issue was opened via the bug report template. labels Feb 18, 2022
@GP-marco
Copy link

Same issue occurs in our code base.
The test logs are messed with hundreds of these warnings and it is impossible to see important warnings/errors.

@balazsorban44
Copy link
Member

This should be fixed on canary, please upgrade and try it out!

@theoludwig
Copy link
Contributor Author

This should be fixed on canary, please upgrade and try it out!

Indeed it is, thanks!
For reference and pure curiosity, do you know which commit fixed this? @balazsorban44

@balazsorban44
Copy link
Member

It was this release: https://github.com/vercel/next.js/releases/tag/v12.1.6-canary.13

Likely this PR: #36500

@github-actions
Copy link
Contributor

github-actions bot commented Jun 1, 2022

This closed issue has been automatically locked because it had no new activity for a month. 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 Jun 1, 2022
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Assignees
No one assigned
Labels
Testing Related to testing with Next.js.
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
3 participants
@balazsorban44 @theoludwig @GP-marco