diff --git a/tests/arbitrary-values.test.css b/tests/arbitrary-values.test.css index df4e216c9d5e..9fff5698b0cf 100644 --- a/tests/arbitrary-values.test.css +++ b/tests/arbitrary-values.test.css @@ -652,9 +652,15 @@ .bg-\[\#0f0_var\(--value\)\] { background-color: #0f0 var(--value); } +.bg-\[var\(--value1\)_var\(--value2\)\] { + background-color: var(--value1) var(--value2); +} .bg-\[color\:var\(--value1\)_var\(--value2\)\] { background-color: var(--value1) var(--value2); } +.bg-\[var\(--value\)\2c var\(--value\)\] { + background-color: var(--value), var(--value); +} .bg-opacity-\[0\.11\] { --tw-bg-opacity: 0.11; } diff --git a/tests/arbitrary-values.test.js b/tests/arbitrary-values.test.js index baea4ddef9c5..a4dbf6fe990a 100644 --- a/tests/arbitrary-values.test.js +++ b/tests/arbitrary-values.test.js @@ -262,11 +262,58 @@ it('should not convert escaped underscores with spaces', () => { }) }) -it('should warn and not generate if arbitrary values are ambiguous', () => { - // If we don't protect against this, then `bg-[200px_100px]` would both - // generate the background-size as well as the background-position utilities. +it('should pick the fallback plugin when arbitrary values collide', () => { let config = { - content: [{ raw: html`
` }], + content: [ + { + raw: html` +