From cecb743d1c6f67cd30453759ecb2496775973095 Mon Sep 17 00:00:00 2001
From: "Dusan Mijatovic (Mac2023)" <d.mijatovic@esciencecenter.nl>
Date: Thu, 1 Feb 2024 21:06:16 +0100
Subject: [PATCH] Start item numbering from 1 instead of 0. Update unit and
 integration tests Added playwright headed script for local use

---
 README.md                                                  | 4 ++--
 apps/haddock3-download/integration-tests/topoaamol.spec.ts | 2 +-
 apps/haddock3-download/package.json                        | 1 +
 docs/uiSchema.md                                           | 2 +-
 packages/form/src/table/TableField.test.tsx                | 6 +++---
 packages/form/src/useIndexable.ts                          | 4 ++--
 6 files changed, 10 insertions(+), 9 deletions(-)

diff --git a/README.md b/README.md
index 79a354e..04399de 100644
--- a/README.md
+++ b/README.md
@@ -74,10 +74,10 @@ Tests can be run with
 yarn test:integration
 ```
 
-To run in a non-headless browser use
+To run a non-headless chromium browser use
 
 ```shell
-yarn test:integration --headed
+yarn test:headed
 ```
 
 The browser will pause when a test calls `await page.pause()`, so you can investigate current state.
diff --git a/apps/haddock3-download/integration-tests/topoaamol.spec.ts b/apps/haddock3-download/integration-tests/topoaamol.spec.ts
index 0b4c419..678f56c 100644
--- a/apps/haddock3-download/integration-tests/topoaamol.spec.ts
+++ b/apps/haddock3-download/integration-tests/topoaamol.spec.ts
@@ -11,7 +11,7 @@ test.describe('given 1 molecule and a topoaa node with segment id defined', () =
     await page.locator('input[type="text"]').fill('x')
     // Upload e2a-hpr_1GGR.pdb
     const file1 = await readFile('./integration-tests/data/e2a-hpr_1GGR.pdb')
-    await page.locator('text=0* >> input[type="file"]')
+    await page.locator('text=1* >> input[type="file"]')
       .setInputFiles({ name: 'e2a-hpr_1GGR.pdb', mimeType: 'chemical/x-pdb', buffer: file1 })
     // Click text=Save
     await page.locator('button:has-text("Save")').click()
diff --git a/apps/haddock3-download/package.json b/apps/haddock3-download/package.json
index 145d14e..ca70f20 100644
--- a/apps/haddock3-download/package.json
+++ b/apps/haddock3-download/package.json
@@ -8,6 +8,7 @@
     "serve": "vite preview",
     "lint": "ts-standard",
     "test:integration": "playwright test",
+    "test:headed": "playwright test --project=chromium --headed",
     "clean": "rm -rf .turbo && rm -rf node_modules && rm -rf dist"
   },
   "dependencies": {
diff --git a/docs/uiSchema.md b/docs/uiSchema.md
index 649a12f..29ca207 100644
--- a/docs/uiSchema.md
+++ b/docs/uiSchema.md
@@ -143,7 +143,7 @@ For example
 }
 ```
 
-The fourth array item will get index `3` as the lookup array only resolves the first 3 array items.
+The fourth array item will get index `4` as the lookup array only resolves the first 3 array items.
 
 ### Molecule filename as index
 
diff --git a/packages/form/src/table/TableField.test.tsx b/packages/form/src/table/TableField.test.tsx
index 2a45368..5909ec8 100644
--- a/packages/form/src/table/TableField.test.tsx
+++ b/packages/form/src/table/TableField.test.tsx
@@ -102,7 +102,7 @@ describe('<TableField/>', () => {
       expect(prop1th?.parentElement?.children).toHaveLength(3)
     })
 
-    it.each(['0', '1', '2', '4', '5'])(
+    it.each(['1', '2', '3', '4', '5', '6'])(
       'should have an index column with text %s',
       (index) => {
         const cell = screen.getByText(index)
@@ -132,7 +132,7 @@ describe('<TableField/>', () => {
       expect(prop1th?.parentElement?.children).toHaveLength(3)
     })
 
-    it.each(['0', '1', '2', '4', '5'])(
+    it.each(['1', '2', '3', '4', '5', '6'])(
       'should have an index column with text %s',
       (index) => {
         const cell = screen.getByText(index)
@@ -162,7 +162,7 @@ describe('<TableField/>', () => {
       expect(prop1th?.parentElement?.children).toHaveLength(3)
     })
 
-    it.each(['a', 'b', 'c', '4', '5'])(
+    it.each(['a', 'b', 'c', '4', '5', '6'])(
       'should have an index column with text %s',
       (index) => {
         const cell = screen.getByText(index)
diff --git a/packages/form/src/useIndexable.ts b/packages/form/src/useIndexable.ts
index 4698ec2..eab3de7 100644
--- a/packages/form/src/useIndexable.ts
+++ b/packages/form/src/useIndexable.ts
@@ -13,7 +13,7 @@ export const useIndexable = (uiSchema: UiSchema): [boolean, (n: number) => strin
   if (indexable &&
     Array.isArray(uiOptions.indexable)) {
     const lookup: string[] = uiOptions.indexable
-    return [indexable, (i: number) => i < lookup.length ? lookup[i] : `${i}`]
+    return [indexable, (i: number) => i < lookup.length ? lookup[i] : `${i + 1}`]
   }
-  return [indexable, (i: number) => `${i}`]
+  return [indexable, (i: number) => `${i + 1}`]
 }