Skip to content

Commit

Permalink
Add test for server CSS imports (#40019)
Browse files Browse the repository at this point in the history
Now we are covering all 8 scenarios in our tests: server-client × global-CSS Modules × page-layout. Next step is to cover HMR and page navigation cases.

## Bug

- [ ] Related issues linked using `fixes #number`
- [x] Integration tests added
- [ ] Errors have helpful link attached, see `contributing.md`

## Feature

- [ ] Implements an existing feature request or RFC. Make sure the feature request has been accepted for implementation before opening a PR.
- [ ] Related issues linked using `fixes #number`
- [ ] Integration tests added
- [ ] Documentation added
- [ ] Telemetry added. In case of a feature if it's used or not.
- [ ] Errors have helpful link attached, see `contributing.md`

## Documentation / Examples

- [ ] Make sure the linting passes by running `pnpm lint`
- [ ] The examples guidelines are followed from [our contributing doc](https://github.com/vercel/next.js/blob/canary/contributing.md#adding-examples)
  • Loading branch information
shuding committed Aug 28, 2022
1 parent f6c96e0 commit afbf4b1
Show file tree
Hide file tree
Showing 3 changed files with 30 additions and 4 deletions.
10 changes: 9 additions & 1 deletion test/e2e/app-dir/app/app/css/css-page/page.server.js
@@ -1,5 +1,13 @@
import './style.css'
import styles from './style.module.css'

export default function Page() {
return <h1>Page</h1>
return (
<>
<h1>Page</h1>
<div id="cssm" className={styles.mod}>
CSSM
</div>
</>
)
}
3 changes: 3 additions & 0 deletions test/e2e/app-dir/app/app/css/css-page/style.module.css
@@ -0,0 +1,3 @@
.mod {
color: blue;
}
21 changes: 18 additions & 3 deletions test/e2e/app-dir/index.test.ts
Expand Up @@ -1080,9 +1080,24 @@ describe('app dir', () => {
})
})

describe.skip('server pages', () => {
it('should support global css inside server pages', async () => {})
it('should support css modules inside server pages', async () => {})
describe('server pages', () => {
it('should support global css inside server pages', async () => {
const browser = await webdriver(next.url, '/css/css-page')
expect(
await browser.eval(
`window.getComputedStyle(document.querySelector('h1')).color`
)
).toBe('rgb(255, 0, 0)')
})

it('should support css modules inside server pages', async () => {
const browser = await webdriver(next.url, '/css/css-page')
expect(
await browser.eval(
`window.getComputedStyle(document.querySelector('#cssm')).color`
)
).toBe('rgb(0, 0, 255)')
})
})

describe('client layouts', () => {
Expand Down

0 comments on commit afbf4b1

Please sign in to comment.