cloudflare / cloudflare/vinext

`next/dynamic`: CSS imported by dynamically loaded components not applied

Open
#1,515 4 comments 0 reactions 0 assignees View on GitHub
adapter-api-e2e help wanted
Dominant language
TypeScript
Stars
8.8k
Forks
406
Avg merge
2d 6h
Merged PRs (30d)
120

Description

> *This issue was created by an agent analysing CI failures from the [Next.js Deploy Suite](https://github.com/cloudflare/vinext/actions/runs/26282973805) (vinext `main` vs Next.js `v16.2.6`, 2026-05-22).*

## Problem

When a component is loaded via `next/dynamic`, the CSS it imports (global, CSS modules) is not injected into the page. Components fail to become visible (zero size due to missing styles), causing all 4 tests in the suite to time out waiting for elements.

```
waiting for locator('#server') to be visible — CSS for dynamic component never injected
```

## Estimated Impact

~4 test failures across the deploy suite.

## Affected Test Suites

- `test/e2e/app-dir/next-dynamic-css/next-dynamic-css.test.ts` (4 failures)

## Recommendation

1. **Reproduce first in vinext's own test suite.** Add a `next/dynamic` import of a component that imports a CSS module and assert the rendered text is visible (i.e. CSS was applied).

2. **Inject the dynamic component's CSS on load.** When the dynamic chunk loads, append its associated CSS to the document. Use Vite's CSS asset metadata.

---

Part of #1328.

Contributor guide

Open the contributing guide

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.