[READ-ONLY] Mirror of https://github.com/vitest-dev/vitest. Next generation testing framework powered by Vite.
vitest.dev
test
testing-tools
vite
fix(ui): load panel sizes from storage on initial load (#7265)
authored by
Joaquín Sánchez
and committed by
GitHub
(Apr 17, 2025, 3:51 PM +0200)
6555d61d
816a5c51
+4
-25
+1
-1
packages/ui/client/components/BrowserIframe.vue
+1
-1
packages/ui/client/components/BrowserIframe.vue
···
59
59
<div h="full" flex="~ col">
60
60
<div p="3" h-10 flex="~ gap-2" items-center bg-header border="b base">
61
61
<IconButton
62
-
v-show="panels.navigation <= 2"
62
+
v-show="panels.navigation <= 15"
63
63
v-tooltip.bottom="'Show Navigation Panel'"
64
64
title="Show Navigation Panel"
65
65
rotate-180
-12
packages/ui/client/pages/index.vue
-12
packages/ui/client/pages/index.vue
···
40
40
preventBrowserEvents()
41
41
}, 0)
42
42
43
-
function resizeMain() {
44
-
const width = window.innerWidth
45
-
const panelWidth = Math.min(width / 3, 300)
46
-
mainSizes.value[0] = (100 * panelWidth) / width
47
-
mainSizes.value[1] = 100 - mainSizes.value[0]
48
-
recordMainResize([
49
-
{ size: mainSizes.value[0] },
50
-
{ size: mainSizes.value[1] },
51
-
])
52
-
}
53
-
54
43
function recordMainResize(event: { size: number }[]) {
55
44
panels.navigation = event[0].size
56
45
panels.details.size = event[1].size
···
83
72
class="pt-4px"
84
73
@resized="onMainResized"
85
74
@resize="resizingMain"
86
-
@ready="resizeMain"
87
75
>
88
76
<Pane :size="mainSizes[0]">
89
77
<Navigation />
+3
-6
packages/ui/client/components/explorer/Explorer.vue
+3
-6
packages/ui/client/components/explorer/Explorer.vue
···
8
8
import { config } from '~/composables/client'
9
9
import { useSearch } from '~/composables/explorer/search'
10
10
11
-
import { panels } from '~/composables/navigation'
12
11
import { activeFileId } from '~/composables/params'
13
12
14
13
import 'vue-virtual-scroller/dist/vue-virtual-scroller.css'
···
46
45
47
46
const filterClass = ref<string>('grid-cols-2')
48
47
const filterHeaderClass = ref<string>('grid-col-span-2')
49
-
const testExplorerRef = ref<HTMLInputElement | undefined>()
50
48
51
-
const { width: windowWidth } = useWindowSize()
52
-
53
-
watch(() => windowWidth.value * (panels.navigation / 100), (width) => {
54
-
if (width < 420) {
49
+
const testExplorerRef = ref<HTMLElement | undefined>()
50
+
useResizeObserver(() => testExplorerRef.value, ([{ contentRect }]) => {
51
+
if (contentRect.width < 420) {
55
52
filterClass.value = 'grid-cols-2'
56
53
filterHeaderClass.value = 'grid-col-span-2'
57
54
}