Skip to content

Conversation

@thecrypticace
Copy link
Contributor

Fixes #18370

@thecrypticace
Copy link
Contributor Author

thecrypticace commented Jun 23, 2025

As far as I can tell from the original reproduction in #17295 this still doesn't help.

From this comment angular/angular-cli#29789 (comment)

This issue was related to us not throwing a PostCSS error but even if we do that it doesn't work.

This will take some more investigation.

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

nice work

If we import `postcss` there’s a chance that our code is using a different version than the one the plugin was provided to. This can cause checks like `instanceof` in external tools to fail.
@thecrypticace thecrypticace force-pushed the feat/postcss-error-handling branch from b7c3671 to 4a0d761 Compare June 30, 2025 18:22
@thecrypticace
Copy link
Contributor Author

I found the Angular bug.

Leaving me a note with the reduced CSS plugin so I can file a bug report:

/*
 * Commentary:
 * This plugin demonstrates a rebuild bug in Angular 19
 *
 * The setup consists of three files:
 *
 * File 1: styles.css:
 * ```css
 * @import "./imported.css";
 * ```
 *
 * File 2: imported.css:
 * ```css
 * @--throw-me;
 * ```
 *
 * File 3: This plugin
 *
 * Reproduction:
 *
 * # Build
 * - `npm run start`
 *
 * # Cause an error
 * - `gsed -i 's/@--throw-me/@throw-me/' src/imported.css`
 *
 * # Revert the error and see it's still broken
 * - `gsed -i 's/@throw-me/@--throw-me/' src/imported.css`
 *
 * # Try editing it again and see that it doesn't rebuild
 * - `gsed -i 's/@--throw-me/@--throw-me-2/' src/imported.css`
 *
 * # To recover you *must* edit the "root" stylesheet
 *
 * - `echo '\n.test{}' > src/styles.css`
 */

module.exports = function tailwindcss() {
  return {
    postcssPlugin: "tailwindcss",
    async Once(root, { result }) {
      console.log("postcss called for", result.opts.from);

      // Precondition:
      //
      // We only care about compiles to `styles.css` for this bug report
      if (!result.opts.from?.endsWith("styles.css")) return;

      // Note:
      //
      // Removing the `@import` prevents this plugin from being called for
      // `imported.css` too. This does not affect reproduction of the bug.
      root.removeAll();

      // Requirement 1:
      //
      // `styles.css` must emit a dependency on a file that it also `@import`s
      // during a successful build.
      let path = require("path");
      let importedPath = path.resolve(path.dirname(result.opts.from), "./imported.css");
      result.messages.push({
        type: "dependency",
        plugin: "my-plugin",
        parent: result.opts.from,
        file: importedPath,
      });

      // Requirement 2:
      //
      // `styles.css` must throw an error after a successful rebuild due to
      // a change in an `@import`-ed stylesheet.
      //
      // We'll do this by checking the content directly as we're not using
      // `postcss-import` or anything like that here.
      //
      // Trigger the error by changing `@--throw-me` to `@throw-me`.
      let fs = require("fs");
      let importedFile = fs.readFileSync(importedPath, "utf-8");
      if (importedFile.includes("@throw-me")) throw root.error("ohno");
    },
  };
};

module.exports.postcss = true;
@thecrypticace thecrypticace marked this pull request as ready for review September 18, 2025 15:48
@thecrypticace thecrypticace requested a review from a team as a code owner September 18, 2025 15:48
Copy link
Member

@RobinMalfait RobinMalfait left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Looking good, but I think this small API would make it even better.

Co-authored-by: Robin Malfait <malfait.robin@gmail.com>
@thecrypticace thecrypticace merged commit 5b8136e into main Sep 18, 2025
7 checks passed
@thecrypticace thecrypticace deleted the feat/postcss-error-handling branch September 18, 2025 16:03
ch4og pushed a commit to csmplay/mapban that referenced this pull request Nov 18, 2025
This PR contains the following updates:

| Package | Change | Age | Confidence |
|---|---|---|---|
| [@tailwindcss/postcss](https://tailwindcss.com) ([source](https://github.com/tailwindlabs/tailwindcss/tree/HEAD/packages/@tailwindcss-postcss)) | [`4.1.12` -> `4.1.17`](https://renovatebot.com/diffs/npm/@tailwindcss%2fpostcss/4.1.12/4.1.17) | [![age](https://developer.mend.io/api/mc/badges/age/npm/@tailwindcss%2fpostcss/4.1.17?slim=true)](https://docs.renovatebot.com/merge-confidence/) | [![confidence](https://developer.mend.io/api/mc/badges/confidence/npm/@tailwindcss%2fpostcss/4.1.12/4.1.17?slim=true)](https://docs.renovatebot.com/merge-confidence/) |

---

### Release Notes

<details>
<summary>tailwindlabs/tailwindcss (@&#8203;tailwindcss/postcss)</summary>

### [`v4.1.17`](https://github.com/tailwindlabs/tailwindcss/blob/HEAD/CHANGELOG.md#4117---2025-11-06)

[Compare Source](tailwindlabs/tailwindcss@v4.1.16...v4.1.17)

##### Fixed

- Substitute `@variant` inside legacy JS APIs ([#&#8203;19263](tailwindlabs/tailwindcss#19263))
- Prevent occasional crash on Windows when loaded into a worker thread ([#&#8203;19242](tailwindlabs/tailwindcss#19242))

### [`v4.1.16`](https://github.com/tailwindlabs/tailwindcss/blob/HEAD/CHANGELOG.md#4116---2025-10-23)

[Compare Source](tailwindlabs/tailwindcss@v4.1.15...v4.1.16)

##### Fixed

- Discard candidates with an empty data type ([#&#8203;19172](tailwindlabs/tailwindcss#19172))
- Fix canonicalization of arbitrary variants with attribute selectors ([#&#8203;19176](tailwindlabs/tailwindcss#19176))
- Fix invalid colors due to nested `&` ([#&#8203;19184](tailwindlabs/tailwindcss#19184))
- Improve canonicalization for `& > :pseudo` and `& :pseudo` arbitrary variants ([#&#8203;19178](tailwindlabs/tailwindcss#19178))

### [`v4.1.15`](https://github.com/tailwindlabs/tailwindcss/blob/HEAD/CHANGELOG.md#4115---2025-10-20)

[Compare Source](tailwindlabs/tailwindcss@v4.1.14...v4.1.15)

##### Fixed

- Fix Safari devtools rendering issue due to `color-mix` fallback ([#&#8203;19069](tailwindlabs/tailwindcss#19069))
- Suppress Lightning CSS warnings about `:deep`, `:slotted`, and `:global` ([#&#8203;19094](tailwindlabs/tailwindcss#19094))
- Fix resolving theme keys when starting with the name of another theme key in JS configs and plugins ([#&#8203;19097](tailwindlabs/tailwindcss#19097))
- Allow named groups in combination with `not-*`, `has-*`, and `in-*` ([#&#8203;19100](tailwindlabs/tailwindcss#19100))
- Prevent important utilities from affecting other utilities ([#&#8203;19110](tailwindlabs/tailwindcss#19110))
- Don’t index into strings with the `theme(…)` function ([#&#8203;19111](tailwindlabs/tailwindcss#19111))
- Fix parsing issue when `\t` is used in at-rules ([#&#8203;19130](tailwindlabs/tailwindcss#19130))
- Upgrade: Canonicalize utilities containing `0` values ([#&#8203;19095](tailwindlabs/tailwindcss#19095))
- Upgrade: Migrate deprecated `break-words` to `wrap-break-word` ([#&#8203;19157](tailwindlabs/tailwindcss#19157))

##### Changed

- Remove the `postinstall` script from oxide (\[[#&#8203;19149](https://github.com/tailwindlabs/tailwindcss/issues/19149)])([#&#8203;19149](https://github.com/tailwindlabs/tailwindcss/pull/19149))

### [`v4.1.14`](https://github.com/tailwindlabs/tailwindcss/blob/HEAD/CHANGELOG.md#4114---2025-10-01)

[Compare Source](tailwindlabs/tailwindcss@v4.1.13...v4.1.14)

##### Fixed

- Handle `'` syntax in ClojureScript when extracting classes ([#&#8203;18888](tailwindlabs/tailwindcss#18888))
- Handle `@variant` inside `@custom-variant` ([#&#8203;18885](tailwindlabs/tailwindcss#18885))
- Merge suggestions when using `@utility` ([#&#8203;18900](tailwindlabs/tailwindcss#18900))
- Ensure that file system watchers created when using the CLI are always cleaned up ([#&#8203;18905](tailwindlabs/tailwindcss#18905))
- Do not generate `grid-column` utilities when configuring `grid-column-start` or `grid-column-end` ([#&#8203;18907](tailwindlabs/tailwindcss#18907))
- Do not generate `grid-row` utilities when configuring `grid-row-start` or `grid-row-end` ([#&#8203;18907](tailwindlabs/tailwindcss#18907))
- Prevent duplicate CSS when overwriting a static utility with a theme key ([#&#8203;18056](tailwindlabs/tailwindcss#18056))
- Show Lightning CSS warnings (if any) when optimizing/minifying ([#&#8203;18918](tailwindlabs/tailwindcss#18918))
- Use `default` export condition for `@tailwindcss/vite` ([#&#8203;18948](tailwindlabs/tailwindcss#18948))
- Re-throw errors from PostCSS nodes ([#&#8203;18373](tailwindlabs/tailwindcss#18373))
- Detect classes in markdown inline directives ([#&#8203;18967](tailwindlabs/tailwindcss#18967))
- Ensure files with only `@theme` produce no output when built ([#&#8203;18979](tailwindlabs/tailwindcss#18979))
- Support Maud templates when extracting classes ([#&#8203;18988](tailwindlabs/tailwindcss#18988))
- Upgrade: Do not migrate `variant = 'outline'` during upgrades ([#&#8203;18922](tailwindlabs/tailwindcss#18922))
- Upgrade: Show version mismatch (if any) when running upgrade tool ([#&#8203;19028](tailwindlabs/tailwindcss#19028))
- Upgrade: Ensure first class inside `className` is migrated ([#&#8203;19031](tailwindlabs/tailwindcss#19031))
- Upgrade: Migrate classes inside `*ClassName` and `*Class` attributes ([#&#8203;19031](tailwindlabs/tailwindcss#19031))

### [`v4.1.13`](https://github.com/tailwindlabs/tailwindcss/blob/HEAD/CHANGELOG.md#4113---2025-09-03)

[Compare Source](tailwindlabs/tailwindcss@v4.1.12...v4.1.13)

##### Changed

- Drop warning from browser build ([#&#8203;18731](tailwindlabs/tailwindcss#18731))
- Drop exact duplicate declarations when emitting CSS ([#&#8203;18809](tailwindlabs/tailwindcss#18809))

##### Fixed

- Don't transition `visibility` when using `transition` ([#&#8203;18795](tailwindlabs/tailwindcss#18795))
- Discard matched variants with unknown named values ([#&#8203;18799](tailwindlabs/tailwindcss#18799))
- Discard matched variants with non-string values ([#&#8203;18799](tailwindlabs/tailwindcss#18799))
- Show suggestions for known `matchVariant` values ([#&#8203;18798](tailwindlabs/tailwindcss#18798))
- Replace deprecated `clip` with `clip-path` in `sr-only` ([#&#8203;18769](tailwindlabs/tailwindcss#18769))
- Hide internal fields from completions in `matchUtilities` ([#&#8203;18820](tailwindlabs/tailwindcss#18820))
- Ignore `.vercel` folders by default (can be overridden by `@source …` rules) ([#&#8203;18855](tailwindlabs/tailwindcss#18855))
- Consider variants starting with `@-` to be invalid (e.g. `@-2xl:flex`) ([#&#8203;18869](tailwindlabs/tailwindcss#18869))
- Do not allow custom variants to start or end with a `-` or `_` ([#&#8203;18867](tailwindlabs/tailwindcss#18867), [#&#8203;18872](tailwindlabs/tailwindcss#18872))
- Upgrade: Migrate `aria` theme keys to `@custom-variant` ([#&#8203;18815](tailwindlabs/tailwindcss#18815))
- Upgrade: Migrate `data` theme keys to `@custom-variant` ([#&#8203;18816](tailwindlabs/tailwindcss#18816))
- Upgrade: Migrate `supports` theme keys to `@custom-variant` ([#&#8203;18817](tailwindlabs/tailwindcss#18817))

</details>

---

### Configuration

📅 **Schedule**: Branch creation - At any time (no schedule defined), Automerge - At any time (no schedule defined).

🚦 **Automerge**: Disabled by config. Please merge this manually once you are satisfied.

♻ **Rebasing**: Whenever PR becomes conflicted, or you tick the rebase/retry checkbox.

🔕 **Ignore**: Close this PR and you won't be reminded about this update again.

---

 - [ ] <!-- rebase-check -->If you want to rebase/retry this PR, check this box

---

This PR has been generated by [Renovate Bot](https://github.com/renovatebot/renovate).
<!--renovate-debug:eyJjcmVhdGVkSW5WZXIiOiI0MS4xNDguNCIsInVwZGF0ZWRJblZlciI6IjQyLjAuMyIsInRhcmdldEJyYW5jaCI6Im1haW4iLCJsYWJlbHMiOltdfQ==-->

Reviewed-on: https://git.in.csmpro.ru/csmpro/csm-mapban/pulls/28
Co-authored-by: Renovate Bot <renovate@csmpro.ru>
Co-committed-by: Renovate Bot <renovate@csmpro.ru>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

4 participants