Skip to content

[Turbopack] ::target-text pseudo-element is not recognized #76632

@JorianWoltjer

Description

@JorianWoltjer

Link to the code that reproduces this issue

https://codesandbox.io/p/devbox/lingering-bash-hz2dgk?workspaceId=ws_MuNQxfRHg6TpeC7ZYcnAEX

To Reproduce

  1. (see CodeSandbox) Import any local CSS file with a ::target-text selector
  2. (see CodeSandbox) In package.json, set "dev": "next dev --turbopack"
  3. Run a development server using npm run dev
  4. Visit http://localhost:3000, and notice the error about ::target-text not being recognized:
    Image
  5. If you would remove --turbopack from the package.json, it would succesfully build and function:
    Image

Current vs. Expected behavior

See the screenshots above. I expect turbopack to result in supporting the same functionality as the version without turbopack would, so that the ::target-text pseudo-element is recognized. When I click on the anchor tag in a browser that supports Scroll To Text Fragment (such as Chrome) I expect to see the paragraph text receive a red background as defined by the style.

Provide environment information

See CodeSandbox

Which area(s) are affected? (Select all that apply)

Turbopack

Which stage(s) are affected? (Select all that apply)

next dev (local)

Additional context

No response

Metadata

Metadata

Assignees

No one assigned

    Labels

    CSSRelated to CSS.TurbopackRelated to Turbopack with Next.js.locked

    Type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions