✨ feat(vscode): 代码阅读函数块默认折叠，函数说明进属性表「说明」行

vscode/webview-ui/src/codeReader/viewState.test.ts

@@ -1,38 +1,65 @@
-import type { ViewState, ViewStateStorage } from './viewState'
+import type { BlockKind, BlockView } from './types'
+import type { ViewStateStorage } from './viewState'
 import { describe, expect, it } from 'vitest'
-import { createViewStateStore, propertyRowId } from './viewState'
+import { collapsedIds, createViewStateStore, propertyRowId } from './viewState'
 
-/** 模拟 VS Code 的 webview 状态：存进去的要能序列化，页面重新加载后原样取回 */
-function memoryStorage(): ViewStateStorage {
-  let saved: string | undefined
+/** 模拟 VS Code 的 webview 状态：存进去的要能序列化，页面重新加载后原样取回；也能塞进旧版本存的东西 */
+function memoryStorage(initial?: unknown): ViewStateStorage {
+  let saved = initial === undefined ? undefined : JSON.stringify(initial)
   return {
-    getState: () => saved === undefined ? undefined : JSON.parse(saved) as ViewState,
+    getState: () => saved === undefined ? undefined : JSON.parse(saved) as unknown,
     setState: (state) => {
       saved = JSON.stringify(state)
     },
   }
 }
 
+function block(id: string, kind: BlockKind, children: BlockView[] = []): BlockView {
+  return { id, kind, startLine: 0, endLine: 0, code: '', codeTokens: [], children, translation: [] }
+}
+
+/**
+ * 0    import
+ * 1    function
+ * 1.0    if
+ * 1.0.0    function（嵌套函数）
+ * 2    class
+ * 2.0    function（方法）
+ */
+const BLOCKS = [
+  block('0', 'import'),
+  block('1', 'function', [block('1.0', 'if', [block('1.0.0', 'function', [block('1.0.0.0', 'return')])])]),
+  block('2', 'class', [block('2.0', 'function', [block('2.0.0', 'return')])]),
+]
+
 describe('webview 状态', () => {
-  it('第一次打开：没有编辑中、折叠的块，也没有滚动位置', () => {
-    expect(createViewStateStore(memoryStorage()).get()).toEqual({ editing: [], collapsed: [] })
+  it('第一次打开：没有编辑中的块、没点过折叠，也没有滚动位置', () => {
+    expect(createViewStateStore(memoryStorage()).get()).toEqual({ editing: [], folds: {} })
   })
 
   it('块状态和滚动位置各自更新，互不覆盖', () => {
     const storage = memoryStorage()
     const store = createViewStateStore(storage)
-    store.update({ editing: ['2'], collapsed: ['6.1'] })
+    store.update({ editing: ['2'], folds: { 6.1: true } })
     store.update({ scroll: { line: 12, offset: 30, scrollTop: 480 } })
-    store.update({ editing: [], collapsed: ['6.1'] })
-    expect(storage.getState()).toEqual({ editing: [], collapsed: ['6.1'], scroll: { line: 12, offset: 30, scrollTop: 480 } })
+    store.update({ editing: [], folds: { 6.1: true } })
+    expect(storage.getState()).toEqual({ editing: [], folds: { 6.1: true }, scroll: { line: 12, offset: 30, scrollTop: 480 } })
   })
 
   it('页面重新加载后取回上次存的全部状态', () => {
     const storage = memoryStorage()
     const store = createViewStateStore(storage)
-    store.update({ collapsed: ['3'] })
+    store.update({ folds: { 3: true, 4: false } })
     store.update({ scroll: { line: 40, offset: -6, scrollTop: 1210 } })
-    expect(createViewStateStore(storage).get()).toEqual({ editing: [], collapsed: ['3'], scroll: { line: 40, offset: -6, scrollTop: 1210 } })
+    expect(createViewStateStore(storage).get()).toEqual({ editing: [], folds: { 3: true, 4: false }, scroll: { line: 40, offset: -6, scrollTop: 1210 } })
+  })
+
+  it('旧版本存的、形状不对的项当没存过，认得的项照旧取回', () => {
+    expect(createViewStateStore(memoryStorage({ editing: ['1'], collapsed: ['2'] })).get()).toEqual({ editing: ['1'], folds: {} })
+    expect(createViewStateStore(memoryStorage({ editing: 'x', folds: ['2'], scroll: { line: 'a' } })).get()).toEqual({ editing: [], folds: {} })
+    expect(createViewStateStore(memoryStorage({ editing: [1, '2'], folds: { 1: true, 2: 'yes' } })).get()).toEqual({ editing: ['2'], folds: { 1: true } })
+    expect(createViewStateStore(memoryStorage(42)).get()).toEqual({ editing: [], folds: {} })
+    expect(createViewStateStore(memoryStorage(null)).get()).toEqual({ editing: [], folds: {} })
   })
 
   it('属性行的折叠 id 是块 id 加行序号，不会和块 id 撞上', () => {
@@ -41,9 +68,20 @@ describe('webview 状态', () => {
     expect(propertyRowId('6.1', 0)).not.toBe(propertyRowId('6', 10))
   })
 
-  it('属性行和块的折叠状态存在同一份 collapsed 里，页面重新加载后都还在', () => {
+  it('属性行和块的折叠选择存在同一份 folds 里，页面重新加载后都还在', () => {
     const storage = memoryStorage()
-    createViewStateStore(storage).update({ collapsed: ['6.1', propertyRowId('6.1.0', 3)] })
-    expect(createViewStateStore(storage).get().collapsed).toEqual(['6.1', '6.1.0/p3'])
+    createViewStateStore(storage).update({ folds: { 6.1: false, [propertyRowId('6.1.0', 3)]: true } })
+    expect(createViewStateStore(storage).get().folds).toEqual({ '6.1': false, '6.1.0/p3': true })
+  })
+})
+
+describe('眼下折叠着哪些', () => {
+  it('没点过：函数块（含方法、嵌套函数）折叠，其余块和属性行展开', () => {
+    expect([...collapsedIds(BLOCKS, {})].sort()).toEqual(['1', '1.0.0', '2.0'])
+  })
+
+  it('点过的按用户的：展开的函数保持展开，折叠的其他块、属性行保持折叠', () => {
+    const folds = { '1': false, '2': true, '1.0.0': false, [propertyRowId('0', 2)]: true, [propertyRowId('2.0', 1)]: false }
+    expect([...collapsedIds(BLOCKS, folds)].sort()).toEqual(['0/p2', '2', '2.0'])
   })
 })