@operato/data-grist 10.17.0 → 10.22.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@operato/data-grist",
-  "version": "10.17.0",
+  "version": "10.22.0",
   "description": "User interface for grid (desktop) and list (mobile)",
   "author": "heartyoh",
   "type": "module",
@@ -70,14 +70,14 @@
     "@material/web": "^2.0.0",
     "@operato/headroom": "^10.16.2",
     "@operato/i18n": "^10.16.2",
-    "@operato/input": "^10.16.2",
-    "@operato/list-state": "^10.16.2",
-    "@operato/p13n": "^10.16.2",
-    "@operato/popup": "^10.16.2",
+    "@operato/input": "^10.22.0",
+    "@operato/list-state": "^10.22.0",
+    "@operato/p13n": "^10.22.0",
+    "@operato/popup": "^10.22.0",
     "@operato/pull-to-refresh": "^10.16.2",
     "@operato/styles": "^10.16.2",
     "@operato/time-calculator": "^10.16.2",
-    "@operato/utils": "^10.16.2",
+    "@operato/utils": "^10.22.0",
     "i18next": "^24.2.1",
     "json5": "^2.2.0",
     "lit": "^3.1.2",
@@ -116,5 +116,5 @@
       "prettier --write"
     ]
   },
-  "gitHead": "f5851c0f8ea672b5369951395f2413cd4939ede9"
+  "gitHead": "1da01ac5d48c0b60ec27286d5f9f08d3ad6b971a"
 }

package/test/search-term.test.ts

@@ -0,0 +1,156 @@
+/* Elements are compared by presence, not by value: a failing element comparison makes chai render the DOM and hang the runner. */
+import { expect, fixture } from '@open-wc/testing'
+import { html } from 'lit'
+
+import '../src/data-grist.js'
+
+/**
+ * 검색 낱말이 서버까지 닿는 두 길.
+ *
+ * ── 옛 길(`columns`, 지금 기본) ────────────────────────────────────────────
+ * 격자가 **칸의 선언**을 보고 필드마다 `{name, operator:'search', value:'%낱말%'}` 를 만든다. 그래서
+ * 화면이 서버의 `searchables` 를 손으로 베껴 칸에 적어야 하고, 하나도 안 적으면 낱말이 **조용히
+ * 버려진다** — 목록은 오류 없이 통째로 오고 사람은 「그 번호가 없구나」로 읽는다. 프레임워크 화면
+ * 아홉이 그 상태였다(2026-09-19).
+ *
+ * ── 새 길(`term`) ─────────────────────────────────────────────────────────
+ * 격자가 낱말을 그대로 싣고 서버가 자기 `searchables` 로 푼다(`ListParam.search`). 화면에서 사본이
+ * 사라지므로 어긋날 자리도 사라진다.
+ *
+ * ── 기본을 안 바꾼다 ──────────────────────────────────────────────────────
+ * 이 부품은 우리 저장소 밖에서도 쓴다(dssp 40 파일 · fmsim 6). 그래서 새 길은 **켜는 쪽**이고, 옛
+ * 길의 거동은 글자까지 그대로 둔다. 기본값을 뒤집는 것은 그쪽에 알린 뒤의 별도 결정이다.
+ */
+
+type Seen = { filters?: any[]; search?: string }
+
+const columns = [
+  { type: 'string', name: 'id', hidden: true },
+  { type: 'string', name: 'name', header: 'name', filter: 'search' },
+  { type: 'string', name: 'description', header: 'description', filter: 'search' },
+  { type: 'string', name: 'state', header: 'state' }
+]
+
+const settle = (ms = 150) => new Promise(resolve => setTimeout(resolve, ms))
+
+async function grist(searchMode?: 'columns' | 'term') {
+  const seen: Seen[] = []
+  const el = (await fixture(html`
+    <ox-grist
+      style="height: 300px"
+      mode="GRID"
+      search-mode=${searchMode ?? 'columns'}
+      .config=${{ columns, pagination: { pages: [20] } }}
+      .fetchHandler=${async (param: any) => {
+        seen.push({ filters: param.filters, search: param.search })
+        return { page: 1, limit: 20, total: 0, records: [] }
+      }}
+    ></ox-grist>
+  `)) as any
+
+  await el.fetch().catch(() => {})
+  await settle()
+  return { el, seen }
+}
+
+const searchFilters = (seen: Seen[]) => (seen[seen.length - 1].filters ?? []).filter(one => one.operator === 'search')
+
+describe('검색 낱말이 나가는 길', () => {
+  /*
+   * fixture 안의 격자는 붙는 순간 Chrome 의 `ResizeObserver loop completed` 를 던진다. 브라우저가 한
+   * 틱에 두 번 재는 것뿐이고 이 시험이 보는 것과 무관한데, mocha 는 그것을 **시험 실패로 센다** —
+   * 안 걸러 두면 여기 여섯이 통째로 빨강이고 까닭은 실패 이름에 안 나온다. `fetch-failure-state` 가
+   * 쓰는 것과 같은 거르개다(리스너 하나로는 안 된다 — mocha 는 `window.onerror` 쪽도 본다).
+   */
+  const ignoreResizeLoop = (e: ErrorEvent) => {
+    if (String(e.message).includes('ResizeObserver loop')) {
+      e.stopImmediatePropagation()
+      e.preventDefault()
+    }
+  }
+  let previousOnError: OnErrorEventHandler = null
+
+  before(() => {
+    window.addEventListener('error', ignoreResizeLoop, true)
+    previousOnError = window.onerror
+    window.onerror = (message, ...rest) =>
+      String(message).includes('ResizeObserver loop') ? true : previousOnError?.call(window, message, ...rest)
+  })
+
+  after(() => {
+    window.removeEventListener('error', ignoreResizeLoop, true)
+    window.onerror = previousOnError
+  })
+
+  it('옛 길은 칸마다 필터를 만든다 — 지금 거동 그대로', async () => {
+    const { el, seen } = await grist()
+
+    el.searchText = '구본'
+    await settle()
+
+    expect(searchFilters(seen).map(one => one.name)).to.eql(['name', 'description'])
+    expect(searchFilters(seen)[0].value).to.equal('%구본%')
+    expect(seen[seen.length - 1].search).to.equal(undefined)
+  })
+
+  it('옛 길에서 낱말을 되읽는다', async () => {
+    const { el } = await grist()
+
+    el.searchText = '구본'
+    await settle()
+
+    expect(el.searchText).to.equal('구본')
+
+    el.searchText = ''
+    await settle()
+
+    expect(el.searchText).to.equal('')
+  })
+
+  it('새 길은 낱말을 그대로 싣고 칸 선언을 읽지 않는다', async () => {
+    /*
+     * 칸 둘이 `filter: 'search'` 를 선언한 채로 둔다. 같은 낱말이 두 번 걸리지 않아야 한다 —
+     * 한 화면에 두 길이 같이 서는 것이 이 설계에서 제일 막아야 하는 것이다.
+     */
+    const { el, seen } = await grist('term')
+
+    el.searchText = '구본'
+    await settle()
+
+    expect(seen[seen.length - 1].search).to.equal('구본')
+    expect(searchFilters(seen)).to.eql([])
+  })
+
+  it('새 길에서도 낱말을 되읽는다 — 제목 줄이 이것으로 자기 값을 그린다', async () => {
+    /*
+     * 옛 길의 되읽기는 `filters` 에서 `%낱말%` 을 벗겨 답했다. 새 길에는 그 필터가 없으므로 격자가
+     * 자기 상태로 들어야 한다. 이 자리가 이 변경에서 제일 조용히 깨질 곳이다.
+     */
+    const { el } = await grist('term')
+
+    el.searchText = '구본'
+    await settle()
+
+    expect(el.searchText).to.equal('구본')
+  })
+
+  it('새 길에서 낱말을 비우면 되읽은 것도 비고, 낱말도 안 나간다', async () => {
+    const { el, seen } = await grist('term')
+
+    el.searchText = '구본'
+    await settle()
+    el.searchText = ''
+    await settle()
+
+    expect(el.searchText).to.equal('')
+    expect(seen[seen.length - 1].search || '').to.equal('')
+  })
+
+  it('길을 안 고르면 옛 길이다 — 밖의 소비자가 그날 안 바뀐다', async () => {
+    const el = (await fixture(html`
+      <ox-grist style="height: 300px" mode="GRID" .config=${{ columns, pagination: { pages: [20] } }}></ox-grist>
+    `)) as any
+
+    expect(el.searchMode).to.equal('columns')
+  })
+})