cssinjs/jss

Cannot include literal `&` with the nested plugin

Open

#1,135 建立於 2019年6月17日

在 GitHub 查看
 (2 留言) (0 反應) (0 負責人)JavaScript (434 fork)batch import
bughelp wanted

倉庫指標

Star
 (7,000 star)
PR 合併指標
 (30 天內沒有已合併 PR)

描述

Expected behavior: A clear and concise description of what you expected to happen.

A way to escape & so the nested plugin does not auto-convert it to the selector.

Describe the bug: A clear and concise description of what happend instead of the expected behavior.

The following CSS cannot seem to be produced in JSS (with the nested plugin enabled):

someClass: {
  '&[some-attr="A & B"]': { }
}

It gets turned into:

.someClass[some-attr="A .someClass B"] {}

Codesandbox link: Please create a codesandbox.io with the issue. Make it as minimal as possible as this will help us find the bug quicker.

Versions (please complete the following information):

  • jss: 10 alpha 18
  • Browser [e.g. chrome, safari]: Chrome
  • OS [e.g. Windows, macOS]: OS X

Feel free to add any additional versions which you may think are relevant to the bug.

The regex in question looks to be here: const parentRegExp = /&/g

A possible fix might be escaping with && and changing the regex to /(?:^|[^&])&(?:[^&]|$)/g. There may be a more performant option (if that is a concern here).

貢獻者指南