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).

贡献者指南