Skip to content

Commit

Permalink
fix(ui): remove "filters" flickering (#6463)
Browse files Browse the repository at this point in the history
  • Loading branch information
sheremet-va authored Sep 9, 2024
1 parent 97773e2 commit 0223bb7
Show file tree
Hide file tree
Showing 4 changed files with 23 additions and 12 deletions.
4 changes: 2 additions & 2 deletions .github/workflows/ci.yml
Original file line number Diff line number Diff line change
Expand Up @@ -82,7 +82,7 @@ jobs:
os: [ubuntu-latest]
node_version: [18, 20, 22]
include:
- os: macos-14
- os: macos-latest
node_version: 20
- os: windows-latest
node_version: 20
Expand Down Expand Up @@ -124,7 +124,7 @@ jobs:
strategy:
matrix:
os:
- macos-14
- macos-latest
- windows-latest
browser:
- [chromium, chrome]
Expand Down
7 changes: 5 additions & 2 deletions packages/ui/client/components/explorer/Explorer.vue
Original file line number Diff line number Diff line change
Expand Up @@ -11,6 +11,8 @@ import { useSearch } from '~/composables/explorer/search'
import 'vue-virtual-scroller/dist/vue-virtual-scroller.css'
import { config } from '~/composables/client'
import { panels } from '~/composables/navigation'
defineOptions({ inheritAttrs: false })
const { onItemClick } = defineProps<{
Expand Down Expand Up @@ -46,8 +48,9 @@ const filterClass = ref<string>('grid-cols-2')
const filterHeaderClass = ref<string>('grid-col-span-2')
const testExplorerRef = ref<HTMLInputElement | undefined>()
useResizeObserver(testExplorerRef, (entries) => {
const { width } = entries[0].contentRect
const { width: windowWidth } = useWindowSize()
watch(() => windowWidth.value * (panels.navigation / 100), (width) => {
if (width < 420) {
filterClass.value = 'grid-cols-2'
filterHeaderClass.value = 'grid-col-span-2'
Expand Down
14 changes: 11 additions & 3 deletions test/ui/test/html-report.spec.ts
Original file line number Diff line number Diff line change
Expand Up @@ -35,11 +35,19 @@ test.describe('html report', () => {
)

// run vite preview server
previewServer = await preview({ build: { outDir: 'html' }, preview: { port, strictPort: true } })
previewServer = await preview({
build: { outDir: 'html' },
preview: { port, strictPort: true },
})
})

test.afterAll(async () => {
await new Promise<void>((resolve, reject) => {
// if there is no preview server, `startVitest` failed already
if (!previewServer) {
resolve()
return
}
previewServer.httpServer.close((err) => {
if (err) {
reject(err)
Expand Down Expand Up @@ -72,7 +80,7 @@ test.describe('html report', () => {
// report
const sample = page.getByTestId('details-panel').getByLabel('sample.test.ts')
await sample.hover()
await sample.getByTestId('btn-open-details').click()
await sample.getByTestId('btn-open-details').click({ force: true })
await page.getByText('All tests passed in this file').click()

// graph tab
Expand All @@ -96,7 +104,7 @@ test.describe('html report', () => {
await page.goto(pageUrl)
const sample = page.getByTestId('details-panel').getByLabel('fixtures/error.test.ts')
await sample.hover()
await sample.getByTestId('btn-open-details').click()
await sample.getByTestId('btn-open-details').click({ force: true })
await expect(page.getByTestId('diff')).toContainText('- Expected + Received + <style>* {border: 2px solid green};</style>')
})
})
10 changes: 5 additions & 5 deletions test/vite-node/test/server.test.ts
Original file line number Diff line number Diff line change
Expand Up @@ -143,12 +143,12 @@ describe('server correctly caches data', () => {

await viteNode.fetchModule('/src/foo.js', 'ssr')

expect(ssrFiles).toHaveLength(3)
await expect.poll(() => ssrFiles).toHaveLength(3)

// another fetch after invalidation returns cached result
await viteNode.fetchModule('/src/foo.js', 'ssr')

expect(ssrFiles).toHaveLength(3)
await expect.poll(() => ssrFiles).toHaveLength(3)
expect(webFiles).toHaveLength(0)
})

Expand Down Expand Up @@ -200,13 +200,13 @@ describe('server correctly caches data', () => {

await viteNode.fetchModule('/src/foo.js', 'web')

expect(webFiles).toHaveLength(3)
await expect.poll(() => webFiles).toHaveLength(3)

// another fetch after invalidation returns cached result
await viteNode.fetchModule('/src/foo.js', 'web')

expect(webFiles).toHaveLength(3)
expect(ssrFiles).toHaveLength(0)
await expect.poll(() => webFiles).toHaveLength(3)
await expect.poll(() => ssrFiles).toHaveLength(0)
})

it('correctly processes the same file with both transform modes', async ({ viteNode, ssrFiles, webFiles, root }) => {
Expand Down

0 comments on commit 0223bb7

Please sign in to comment.