Skip to content

Commit

Permalink
Disable color opacity plugins by default in the oxide engine (#10618)
Browse files Browse the repository at this point in the history 
* disable color opacity plugins by default for the `oxide` engine

* update tests to reflect this change in the `oxide` engine

* update changelog

* reflect changes in integration tests
  • Loading branch information
@RobinMalfait
RobinMalfait committed Feb 17, 2023
1 parent 316282d commit c8bf2d4
Show file tree
Hide file tree
Showing 32 changed files with 2,746 additions and 772 deletions.
4 changes: 4 additions & 0 deletions CHANGELOG.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -19,6 +19,10 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
- Add `caption-side` utilities ([#10470](https://github.com/tailwindlabs/tailwindcss/pull/10470))
- Add `justify-normal` and `justify-stretch` utilities ([#10560](https://github.com/tailwindlabs/tailwindcss/pull/10560))

### Changed

- [Oxide] Disable color opacity plugins by default in the `oxide` engine ([#10618](https://github.com/tailwindlabs/tailwindcss/pull/10618))

## [3.2.7] - 2023-02-16

### Fixed
Expand Down
137 changes: 95 additions & 42 deletions integrations/parcel/tests/integration.test.js
View file
Original file line number Diff line number Diff line change
@@ -1,5 +1,6 @@
let $ = require('../../execute')
let { css, html, javascript } = require('../../syntax')
let { env } = require('../../../lib/lib/sharedState')

let {
readOutputFile,
Expand Down Expand Up @@ -74,20 +75,38 @@ describe('watcher', () => {
await appendToInputFile('index.html', html`<div class="bg-red-500"></div>`)
})

expect(await readOutputFile(/index\.\w+\.css$/)).toIncludeCss(
css`
.bg-red-500 {
--tw-bg-opacity: 1;
background-color: rgb(239 68 68 / var(--tw-bg-opacity));
}
.font-bold {
font-weight: 700;
}
.font-normal {
font-weight: 400;
}
`
)
if (!env.OXIDE) {
expect(await readOutputFile(/index\.\w+\.css$/)).toIncludeCss(
css`
.bg-red-500 {
--tw-bg-opacity: 1;
background-color: rgb(239 68 68 / var(--tw-bg-opacity));
}
.font-bold {
font-weight: 700;
}
.font-normal {
font-weight: 400;
}
`
)
}

if (env.OXIDE) {
expect(await readOutputFile(/index\.\w+\.css$/)).toIncludeCss(
css`
.bg-red-500 {
background-color: #ef4444;
}
.font-bold {
font-weight: 700;
}
.font-normal {
font-weight: 400;
}
`
)
}

return runningProcess.stop()
})
Expand Down Expand Up @@ -128,20 +147,38 @@ describe('watcher', () => {
await appendToInputFile('glob/index.html', html`<div class="bg-red-500"></div>`)
})

expect(await readOutputFile(/index\.\w+\.css$/)).toIncludeCss(
css`
.bg-red-500 {
--tw-bg-opacity: 1;
background-color: rgb(239 68 68 / var(--tw-bg-opacity));
}
.font-bold {
font-weight: 700;
}
.font-normal {
font-weight: 400;
}
`
)
if (!env.OXIDE) {
expect(await readOutputFile(/index\.\w+\.css$/)).toIncludeCss(
css`
.bg-red-500 {
--tw-bg-opacity: 1;
background-color: rgb(239 68 68 / var(--tw-bg-opacity));
}
.font-bold {
font-weight: 700;
}
.font-normal {
font-weight: 400;
}
`
)
}

if (env.OXIDE) {
expect(await readOutputFile(/index\.\w+\.css$/)).toIncludeCss(
css`
.bg-red-500 {
background-color: #ef4444;
}
.font-bold {
font-weight: 700;
}
.font-normal {
font-weight: 400;
}
`
)
}

return runningProcess.stop()
})
Expand Down Expand Up @@ -281,20 +318,36 @@ describe('watcher', () => {
)
})

expect(await readOutputFile(/index\.\w+\.css$/)).toIncludeCss(
css`
/* prettier-ignore */
.btn {
--tw-bg-opacity: 1;
background-color: rgb(239 68 68 / var(--tw-bg-opacity));
border-radius: .25rem;
padding: .25rem .5rem;
}
.font-bold {
font-weight: 700;
}
`
)
if (!env.OXIDE) {
expect(await readOutputFile(/index\.\w+\.css$/)).toIncludeCss(
css`
.btn {
--tw-bg-opacity: 1;
background-color: rgb(239 68 68 / var(--tw-bg-opacity));
border-radius: 0.25rem;
padding: 0.25rem 0.5rem;
}
.font-bold {
font-weight: 700;
}
`
)
}

if (env.OXIDE) {
expect(await readOutputFile(/index\.\w+\.css$/)).toIncludeCss(
css`
.btn {
background-color: #ef4444;
border-radius: 0.25rem;
padding: 0.25rem 0.5rem;
}
.font-bold {
font-weight: 700;
}
`
)
}

return runningProcess.stop()
})
Expand Down
143 changes: 99 additions & 44 deletions integrations/postcss-cli/tests/integration.test.js
View file
Original file line number Diff line number Diff line change
@@ -1,5 +1,6 @@
let $ = require('../../execute')
let { css, html, javascript } = require('../../syntax')
let { env } = require('../../../lib/lib/sharedState')

let { readOutputFile, appendToInputFile, writeInputFile } = require('../../io')({
output: 'dist',
Expand Down Expand Up @@ -60,20 +61,38 @@ describe('watcher', () => {
await appendToInputFile('index.html', html`<div class="bg-red-500"></div>`)
await runningProcess.onStderr(ready)

expect(await readOutputFile('main.css')).toIncludeCss(
css`
.bg-red-500 {
--tw-bg-opacity: 1;
background-color: rgb(239 68 68 / var(--tw-bg-opacity));
}
.font-bold {
font-weight: 700;
}
.font-normal {
font-weight: 400;
}
`
)
if (!env.OXIDE) {
expect(await readOutputFile('main.css')).toIncludeCss(
css`
.bg-red-500 {
--tw-bg-opacity: 1;
background-color: rgb(239 68 68 / var(--tw-bg-opacity));
}
.font-bold {
font-weight: 700;
}
.font-normal {
font-weight: 400;
}
`
)
}

if (env.OXIDE) {
expect(await readOutputFile('main.css')).toIncludeCss(
css`
.bg-red-500 {
background-color: #ef4444;
}
.font-bold {
font-weight: 700;
}
.font-normal {
font-weight: 400;
}
`
)
}

return runningProcess.stop()
})
Expand Down Expand Up @@ -109,20 +128,38 @@ describe('watcher', () => {
await appendToInputFile('glob/index.html', html`<div class="bg-red-500"></div>`)
await runningProcess.onStderr(ready)

expect(await readOutputFile('main.css')).toIncludeCss(
css`
.bg-red-500 {
--tw-bg-opacity: 1;
background-color: rgb(239 68 68 / var(--tw-bg-opacity));
}
.font-bold {
font-weight: 700;
}
.font-normal {
font-weight: 400;
}
`
)
if (!env.OXIDE) {
expect(await readOutputFile('main.css')).toIncludeCss(
css`
.bg-red-500 {
--tw-bg-opacity: 1;
background-color: rgb(239 68 68 / var(--tw-bg-opacity));
}
.font-bold {
font-weight: 700;
}
.font-normal {
font-weight: 400;
}
`
)
}

if (env.OXIDE) {
expect(await readOutputFile('main.css')).toIncludeCss(
css`
.bg-red-500 {
background-color: #ef4444;
}
.font-bold {
font-weight: 700;
}
.font-normal {
font-weight: 400;
}
`
)
}

return runningProcess.stop()
})
Expand Down Expand Up @@ -247,22 +284,40 @@ describe('watcher', () => {
)
await runningProcess.onStderr(ready)

expect(await readOutputFile('main.css')).toIncludeCss(
css`
.btn {
border-radius: 0.25rem;
--tw-bg-opacity: 1;
background-color: rgb(239 68 68 / var(--tw-bg-opacity));
padding-left: 0.5rem;
padding-right: 0.5rem;
padding-top: 0.25rem;
padding-bottom: 0.25rem;
}
.font-bold {
font-weight: 700;
}
`
)
if (!env.OXIDE) {
expect(await readOutputFile('main.css')).toIncludeCss(
css`
.btn {
border-radius: 0.25rem;
--tw-bg-opacity: 1;
background-color: rgb(239 68 68 / var(--tw-bg-opacity));
padding-left: 0.5rem;
padding-right: 0.5rem;
padding-top: 0.25rem;
padding-bottom: 0.25rem;
}
.font-bold {
font-weight: 700;
}
`
)
}

if (env.OXIDE) {
expect(await readOutputFile('main.css')).toIncludeCss(
css`
/* prettier-ignore */
.btn {
border-radius: 0.25rem;
background-color: #ef4444;
padding: 0.25rem 0.5rem;
}
.font-bold {
font-weight: 700;
}
`
)
}

return runningProcess.stop()
})
Expand Down
Loading

0 comments on commit c8bf2d4

Please sign in to comment.