archive-gh-me/tailwindcss
1
0
Fork 0
mirror of https://github.com/tailwindlabs/tailwindcss.git synced 2025-12-08 21:36:08 +00:00
Code Issues Projects Releases Wiki Activity

Fix angle brackets in content (#5585)

Browse Source 
* move to real regexes

These regexes are only calculated once so we don't really have a
performance penalty here. However, it's a bit nicer to do it this way
because now you don't have to think about the proper escapes.

/.*/.source will basically take the source of the regex ".*" without
flags and converts it to a string with the proper escapes for you.

Fun fact, this `.source` property has been supported since Chrome,
Firefox and Safari version 1.

* allow for `'>'` in `content-['>']`
This commit is contained in:
Robin Malfait 2021-09-24 15:22:23 +02:00 committed by GitHub
parent 77d124368a
commit a4d1bdb7fa
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 8 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
src/lib/expandTailwindAtRules.js
View File

@ -7,10 +7,10 @@ let env = sharedState.env
let contentMatchCache = sharedState.contentMatchCache
const PATTERNS = [
"([^<>\"'`\\s]*\\['[^<>\"'`\\s]*'\\])", // `content-['hello']` but not `content-['hello']']`
'([^<>"\'`\\s]*\\["[^<>"\'`\\s]*"\\])', // `content-["hello"]` but not `content-["hello"]"]`
'([^<>"\'`\\s]*\\[[^<>"\'`\\s]+\\])', // `fill-[#bada55]`
'([^<>"\'`\\s]*[^<>"\'`\\s:])', // `px-1.5`, `uppercase` but not `uppercase:`
/([^<>"'`\s]*\['[^"'`\s]*'\])/.source, // `content-['hello']` but not `content-['hello']']`
/([^<>"'`\s]*\["[^"'`\s]*"\])/.source, // `content-["hello"]` but not `content-["hello"]"]`
/([^<>"'`\s]*\[[^"'`\s]+\])/.source, // `fill-[#bada55]`
/([^<>"'`\s]*[^"'`\s:])/.source, // `px-1.5`, `uppercase` but not `uppercase:`].join('|')
].join('|')
const BROAD_MATCH_GLOBAL_REGEXP = new RegExp(PATTERNS, 'g')
const INNER_MATCH_GLOBAL_REGEXP = /[^<>"'`\s.(){}[\]#=%]*[^<>"'`\s.(){}[\]#=%:]/g

3
tests/arbitrary-values.test.css
View File

@ -477,6 +477,9 @@
.content-\[attr\(content-before\)\] {
content: attr(content-before);
}
.content-\[\'\>\'\] {
content: '>';
}
@media (min-width: 1024px) {
.lg\:grid-cols-\[200px\2c repeat\(auto-fill\2c minmax\(15\%\2c 100px\)\)\2c 300px\] {
grid-template-columns: 200px repeat(auto-fill, minmax(15%, 100px)) 300px;

1
tests/arbitrary-values.test.html
View File

@ -132,6 +132,7 @@
<div class="will-change-[top,left] will-change-[var(--will-change)]"></div>
<div class="content-['hello']"></div>
<div class="content-[attr(content-before)]"></div>
<div class="content-['>']"></div>
<div class="accent-[#bada55]"></div>
<div class="accent-[var(--accent-color)]"></div>