Build fails when CSS contains escaped space

[philipp-spiess]

Link to the code that reproduces this issue

https://codesandbox.io/p/sandbox/github/vercel/next.js/tree/canary/examples/reproduction-template

To Reproduce

1. Add a style rule containing an escaped space character to the CSS, e.g.:

   [data-attr=\ ] {
     color: red;
   }

2. pnpm build

Current vs. Expected behavior

Expect build to pass but instead throws with:

HookWebpackError: Cannot read properties of undefined (reading '0')
    at makeWebpackError (/project/workspace/node_modules/.pnpm/[email protected][email protected][email protected]/node_modules/next/dist/compiled/webpack/bundle5.js:29:315788)
    at /project/workspace/node_modules/.pnpm/[email protected][email protected][email protected]/node_modules/next/dist/compiled/webpack/bundle5.js:29:106487
    at eval (eval at create (/project/workspace/node_modules/.pnpm/[email protected][email protected][email protected]/node_modules/next/dist/compiled/webpack/bundle5.js:14:9224), <anonymous>:44:1)
-- inner error --
TypeError: Cannot read properties of undefined (reading '0')
    at /project/workspace/static/css/b0041ae41d46d821.css:1:1
    at Parser.attribute (/project/workspace/node_modules/.pnpm/[email protected][email protected][email protected]/node_modules/next/dist/compiled/cssnano-simple/index.js:320:84899)
    at Parser.parse (/project/workspace/node_modules/.pnpm/[email protected][email protected][email protected]/node_modules/next/dist/compiled/cssnano-simple/index.js:320:99055)
    at Parser.loop (/project/workspace/node_modules/.pnpm/[email protected][email protected][email protected]/node_modules/next/dist/compiled/cssnano-simple/index.js:320:98727)
    at new Parser (/project/workspace/node_modules/.pnpm/[email protected][email protected][email protected]/node_modules/next/dist/compiled/cssnano-simple/index.js:320:84494)
    at Processor._root (/project/workspace/node_modules/.pnpm/[email protected][email protected][email protected]/node_modules/next/dist/compiled/cssnano-simple/index.js:320:101743)
    at Processor._runSync (/project/workspace/node_modules/.pnpm/[email protected][email protected][email protected]/node_modules/next/dist/compiled/cssnano-simple/index.js:320:102250)
    at Processor.processSync (/project/workspace/node_modules/.pnpm/[email protected][email protected][email protected]/node_modules/next/dist/compiled/cssnano-simple/index.js:320:103005)
    at generateUniqueSelector (/project/workspace/node_modules/.pnpm/[email protected][email protected][email protected]/node_modules/next/dist/compiled/cssnano-simple/index.js:320:142312)
    at /project/workspace/node_modules/.pnpm/[email protected][email protected][email protected]/node_modules/next/dist/compiled/cssnano-simple/index.js:320:142631
    at /project/workspace/node_modules/.pnpm/[email protected]/node_modules/postcss/lib/container.js:369:18
caused by plugins in Compilation.hooks.processAssets
TypeError: Cannot read properties of undefined (reading '0')
    at /project/workspace/static/css/b0041ae41d46d821.css:1:1
    at Parser.attribute (/project/workspace/node_modules/.pnpm/[email protected][email protected][email protected]/node_modules/next/dist/compiled/cssnano-simple/index.js:320:84899)
    at Parser.parse (/project/workspace/node_modules/.pnpm/[email protected][email protected][email protected]/node_modules/next/dist/compiled/cssnano-simple/index.js:320:99055)
    at Parser.loop (/project/workspace/node_modules/.pnpm/[email protected][email protected][email protected]/node_modules/next/dist/compiled/cssnano-simple/index.js:320:98727)
    at new Parser (/project/workspace/node_modules/.pnpm/[email protected][email protected][email protected]/node_modules/next/dist/compiled/cssnano-simple/index.js:320:84494)
    at Processor._root (/project/workspace/node_modules/.pnpm/[email protected][email protected][email protected]/node_modules/next/dist/compiled/cssnano-simple/index.js:320:101743)
    at Processor._runSync (/project/workspace/node_modules/.pnpm/[email protected][email protected][email protected]/node_modules/next/dist/compiled/cssnano-simple/index.js:320:102250)
    at Processor.processSync (/project/workspace/node_modules/.pnpm/[email protected][email protected][email protected]/node_modules/next/dist/compiled/cssnano-simple/index.js:320:103005)
    at generateUniqueSelector (/project/workspace/node_modules/.pnpm/[email protected][email protected][email protected]/node_modules/next/dist/compiled/cssnano-simple/index.js:320:142312)
    at /project/workspace/node_modules/.pnpm/[email protected][email protected][email protected]/node_modules/next/dist/compiled/cssnano-simple/index.js:320:142631
    at /project/workspace/node_modules/.pnpm/[email protected]/node_modules/postcss/lib/container.js:369:18

Provide environment information

Operating System:
  Platform: linux
  Arch: x64
  Version: #1 SMP PREEMPT_DYNAMIC Sun Aug  6 20:05:33 UTC 2023
  Available memory (MB): 4242
  Available CPU cores: 2
Binaries:
  Node: 20.9.0
  npm: 9.8.1
  Yarn: 1.22.19
  pnpm: 8.10.2
Relevant Packages:
  next: 15.2.0-canary.66 // Latest available version is detected (15.2.0-canary.66).
  eslint-config-next: N/A
  react: 19.0.0
  react-dom: 19.0.0
  typescript: 5.3.3
Next.js Config:
  output: N/A

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

Webpack

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

next build (local)

Additional context

No response

[samcx]

@philipp-spiess Thank you for submitting an issue!

I was able to replicate the issue. We will be taking a look!