# Don't trigger a full page reload for scanned files that Vite processes as modules

This PR fixes an issue where editing a scanned file that Vite (or one of its plugins) can process as a module, but that isn't currently loaded, caused @tailwindcss/vite to force a full page reload,…

| | |
| --- | --- |
| Status | MERGED |
| Source | github:tailwindlabs/tailwindcss#20336 |
| Original | https://github.com/tailwindlabs/tailwindcss/pull/20336 |
| Workspace | Showcase |
| Tags | github, code, typescript, docs |

## What it does

**The change is spread across 4 files in 3 areas, with no single file dominating.**

4 files changed across 3 areas of tailwindlabs/tailwindcss, 431 added and 7 removed.

This PR fixes an issue where editing a scanned file that Vite (or one of its plugins) can process as a module, but that isn't currently loaded, caused @tailwindcss/vite to force a full page reload,…

**Diagram: Where the change landed. Node size is not to scale; the line counts are exact.**

- tailwindcss (4 files, 438 lines) [accent]
- Tests (2 files, 359 lines) [good]
- Source (1 file, 78 lines) [accent]
- Docs (1 file, 1 lines) [neutral]
- index.test.ts (+227 −0) [bad]
- tailwindcss -> Tests
- tailwindcss -> Source
- tailwindcss -> Docs
- Tests -> index.test.ts : heaviest

- **Heaviest file.** integrations/vite/index.test.ts, +227 −0, which is 52% of the change.
- **Tests moved with it.** 2 test files changed alongside 1 source file.
- **Spread.** 4 files, 438 changed lines in total.

## How it works

**The largest single edit is in index.test.ts.**

Quoted verbatim from the diff. This is the biggest hunk by changed lines, which is where a reviewer's attention usually belongs first.

**Diagram: Source files matched to test files by filename. A name-based match, so treat it as a prompt to look rather than as proof.**

- NO TEST CHANGED (0)
  - every file paired [good]
- TEST CHANGED TOO (1)
  - index.ts (+72 −6) [good]

```typescript
@@ -584,6 +584,233 @@ describe.each(['postcss', 'lightningcss'])('%s', (transformer) => {
     },
   )
 
+  // https://github.com/tailwindlabs/tailwindcss/issues/20320
+  // https://github.com/tailwindlabs/tailwindcss/issues/19903
+  test(
+    'editing scanned files that Vite can process as modules does not trigger a full reload',
+    {
+      fs: {
+        'package.json': json`{}`,
+        'pnpm-workspace.yaml': yaml`
+          #
+          packages:
+            - project-a
+        `,
+        'project-a/package.json': json`
+          {
+            "type": "module",
+            "dependencies": {
+              "@tailwindcss/vite": "workspace:^",
+              "tailwindcss": "workspace:^"
```

_integrations/vite/index.test.ts, +227 −0. The largest hunk in the largest file._

## File map

**Every file this change touches, heaviest first.**

Role is inferred from the path and risk from the path and the line count. Neither was read from the code.

| File | Role | Change | Risk |
| --- | --- | --- | --- |
| `integrations/vite/index.test.ts` | test coverage | modified, +227 −0 | low |
| `integrations/vite/vue.test.ts` | test coverage | modified, +131 −1 | low |
| `packages/@tailwindcss-vite/src/index.ts` | application code | modified, +72 −6 | medium |
| `CHANGELOG.md` | documentation | modified, +1 −0 | none |

## Receipts

**Where each number above comes from.**

All of it is arithmetic over the file list and the check results, so it can be recomputed from the source.

- **Claim.** Placeholder left in the diff: 1 occurrence.
  - Evidence: // transformed. Vite also creates untransformed placeholder
  - Where: packages/@tailwindcss-vite/src/index.ts
- **Claim.** Repeated block: 2 occurrences.
  - Evidence: name: 'hmr-wiretap',
configureServer(server) {
let logFile = path.resolve('hmr.log')
  - Where: integrations/vite/index.test.ts
- **Claim.** 4 files changed, +431 −7.
  - Evidence: integrations/vite/index.test.ts (+227 −0); integrations/vite/vue.test.ts (+131 −1); packages/@tailwindcss-vite/src/index.ts (+72 −6)
  - Where: https://github.com/tailwindlabs/tailwindcss/pull/20336
- **Claim.** index.test.ts carries 52% of the changed lines.
  - Evidence: 227 of 438 changed lines
  - Where: integrations/vite/index.test.ts
- **Claim.** It arrived as 3 commits.
  - Evidence: add failing test
  - Where: commit 0eb0080
- **Claim.** CI reports 0 failing of 10.
  - Evidence: notify
  - Where: CI check: notify
- **Claim.** The change drew 2 comments.
  - Evidence: <h3>Confidence Score: 5/5</h3> The change is safe to merge. It only makes the `hotUpdate` hook return early in cases where a full reload was…
  - Where: comment by greptile-apps[bot]

## Merge order

**A reading order for the review, not a deployment plan.**

Ordered by how expensive each part is to get wrong, which is a structural property rather than an informed one.

1. **Then index.test.ts.** The largest single file in the change, +227 −0.
2. **Finish with the tests.** 2 test files changed. Reading them last tells you what the author believed they were changing.

## What this brief could not check

- No language model read this change. Every statement here is computed from file paths, line counts, and CI status, so it describes the shape of the diff and not what the diff means.
