From d455fa6a9393737113d2f0ed7f9d6f7a0a18882e Mon Sep 17 00:00:00 2001 From: Robin Malfait Date: Mon, 3 Jan 2022 11:24:47 +0100 Subject: [PATCH 1/2] add tests to ensure theme value inside arbitrary values work --- tests/arbitrary-values.test.js | 46 ++++++++++++++++++++++++++++++++++ 1 file changed, 46 insertions(+) diff --git a/tests/arbitrary-values.test.js b/tests/arbitrary-values.test.js index db9890e985da..26c51defa76b 100644 --- a/tests/arbitrary-values.test.js +++ b/tests/arbitrary-values.test.js @@ -293,3 +293,49 @@ it('should support unescaped underscores in URLs', () => { `) }) }) + +it('should be possible to read theme values in arbitrary values (without quotes)', () => { + let config = { + content: [{ raw: html`
` }], + theme: { + spacing: { + 0.5: 'calc(.5 * .25rem)', + 1: 'calc(1 * .25rem)', + }, + }, + } + + return run('@tailwind utilities', config).then((result) => { + return expect(result.css).toMatchFormattedCss(css` + .w-\[theme\(spacing\.1\)\] { + width: calc(1 * 0.25rem); + } + .w-\[theme\(spacing\[0\.5\]\)\] { + width: calc(0.5 * 0.25rem); + } + `) + }) +}) + +it('should be possible to read theme values in arbitrary values (with quotes)', () => { + let config = { + content: [{ raw: html`
` }], + theme: { + spacing: { + 0.5: 'calc(.5 * .25rem)', + 1: 'calc(1 * .25rem)', + }, + }, + } + + return run('@tailwind utilities', config).then((result) => { + return expect(result.css).toMatchFormattedCss(css` + .w-\[theme\(\'spacing\.1\'\)\] { + width: calc(1 * 0.25rem); + } + .w-\[theme\(\'spacing\[0\.5\]\'\)\] { + width: calc(0.5 * 0.25rem); + } + `) + }) +}) From 0fe5a1368491bececf819c354db0b863b3c9144c Mon Sep 17 00:00:00 2001 From: Robin Malfait Date: Mon, 3 Jan 2022 11:26:51 +0100 Subject: [PATCH 2/2] update changelog --- CHANGELOG.md | 1 + 1 file changed, 1 insertion(+) diff --git a/CHANGELOG.md b/CHANGELOG.md index dc32ca8001f3..d805ec19892e 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -11,6 +11,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0 - Improve `DEBUG` flag ([#6797](https://github.com/tailwindlabs/tailwindcss/pull/6797), [#6804](https://github.com/tailwindlabs/tailwindcss/pull/6804)) - Ensure we can use `<` and `>` characters in modifiers ([#6851](https://github.com/tailwindlabs/tailwindcss/pull/6851)) +- Validate `theme()` works in arbitrary values ([#6852](https://github.com/tailwindlabs/tailwindcss/pull/6852)) ## [3.0.8] - 2021-12-28