From 36a41f69916121a43248c11cd090a50bf2166076 Mon Sep 17 00:00:00 2001 From: Kyson Montague Date: Mon, 22 May 2023 22:40:34 -0700 Subject: [PATCH 1/4] Fix datepicker focus and deadline/schedule editing logic --- src/main/frontend/components/datetime.cljs | 27 ++++++++++++++++++---- 1 file changed, 23 insertions(+), 4 deletions(-) diff --git a/src/main/frontend/components/datetime.cljs b/src/main/frontend/components/datetime.cljs index c6c4f856e7..34eef6d1a4 100644 --- a/src/main/frontend/components/datetime.cljs +++ b/src/main/frontend/components/datetime.cljs @@ -10,6 +10,7 @@ [frontend.ui :as ui] [frontend.util :as util] [frontend.mixins :as mixins] + [goog.dom :as gdom] [rum.core :as rum] [logseq.graph-parser.util.page-ref :as page-ref])) @@ -78,6 +79,13 @@ :duration "d"}))} "Add repeater"]))) +(defn restore-focus! + "Restore focus to the active input that triggered the date-picker." + [] + (when-let [input (state/get-input)] + (when-let [current-input (gdom/getElement input)] + (.focus current-input)))) + (defn- clear-timestamp! [] (reset! *timestamp default-timestamp-value) @@ -101,12 +109,21 @@ block-id (or (:block/uuid block) editing-block-id) typ (or @commands/*current-command typ)] - (if (and (state/editing?) (= editing-block-id block-id)) - (editor-handler/set-editing-block-timestamp! typ - text) + (if (and true + ;;(or + ;;(state/editing?) + ;;(let [active-elem (.-activeElement js/document)] + ;;)) + (= editing-block-id block-id) ) + (do + (editor-handler/set-editing-block-timestamp! typ + text) + (restore-focus!)) + (do (editor-handler/set-block-timestamp! block-id typ text)) + ) (when show? (reset! show? false))) @@ -169,6 +186,8 @@ format {:command :page-ref}) (state/clear-editor-action!) - (reset! commands/*current-command nil))))}) + (reset! commands/*current-command nil) + (restore-focus!) + )))}) (when deadline-or-schedule? (time-repeater))])) From dcc7fa24c7fbdb18083b8a94715ce02b0ceeaca5 Mon Sep 17 00:00:00 2001 From: Kyson Montague Date: Thu, 25 May 2023 12:21:43 -0700 Subject: [PATCH 2/4] Clean up edits --- src/main/frontend/components/datetime.cljs | 10 ++-------- 1 file changed, 2 insertions(+), 8 deletions(-) diff --git a/src/main/frontend/components/datetime.cljs b/src/main/frontend/components/datetime.cljs index 34eef6d1a4..7f4901de3b 100644 --- a/src/main/frontend/components/datetime.cljs +++ b/src/main/frontend/components/datetime.cljs @@ -109,20 +109,14 @@ block-id (or (:block/uuid block) editing-block-id) typ (or @commands/*current-command typ)] - (if (and true - ;;(or - ;;(state/editing?) - ;;(let [active-elem (.-activeElement js/document)] - ;;)) - (= editing-block-id block-id) ) + (if (= editing-block-id block-id) (do (editor-handler/set-editing-block-timestamp! typ text) (restore-focus!)) - (do (editor-handler/set-block-timestamp! block-id typ - text)) + text) ) (when show? From f3e4555b361beb97f70c82c76b4594bbf62d3a97 Mon Sep 17 00:00:00 2001 From: Kyson Montague Date: Thu, 25 May 2023 14:12:19 -0700 Subject: [PATCH 3/4] Add e2e test for deadline editing --- e2e-tests/basic.spec.ts | 71 +++++++++++++++++++++++++++++++++++++++++ 1 file changed, 71 insertions(+) diff --git a/e2e-tests/basic.spec.ts b/e2e-tests/basic.spec.ts index 04cf07f261..bf10a91cee 100644 --- a/e2e-tests/basic.spec.ts +++ b/e2e-tests/basic.spec.ts @@ -333,3 +333,74 @@ test('Opening a second datepicker should close the first one #7341', async ({ pa // Close date picker await page.click('a:has-text("2000-05-06 Sat").opacity-80') }) + +test('Block content should be preserved when adding a deadline via datepicker', async({page,block})=>{ + var datePicker, step; + + await createRandomPage(page) + + async function openDatePicker(kind) { + await page.keyboard.type(' /' + kind, { delay: 20 }); + await page.waitForTimeout(100) // Tolerable delay for the action menu to open + await expect(page.locator(`[data-modal-name="commands"]`)).toBeVisible(); + + await page.keyboard.press('Enter'); + await page.waitForTimeout(100) // Tolerable delay for the action menu to open + datePicker = page.locator(`[data-modal-name="date-picker"]`); + await expect(datePicker).toBeVisible(); + return datePicker; + + } + + async function validateDatePickerInput(kind, step) { + // Expect datepicker to disappear + // previously edited block to still be in editing mode + // content of block to be complete with scheduled date + // TODO - add expects + await expect(await block.isEditing()).toBe(true); + + var content = page.locator('textarea >> nth=0'); + await expect(content).toContainText(step); + + if(kind == 'deadline') { + await expect(content).toContainText('DEADLINE'); + } + } + + // Select deadline today using enter key + await block.enterNext(); + step = 'Test a deadline entered using the keyboard'; + await block.mustType(step); + await openDatePicker('deadline'); + await page.keyboard.press('Enter'); + await validateDatePickerInput('deadline', step); + + // Select deadline today using mouse click on submit button + await block.enterNext(); + step = 'Test a deadline entered using the mouse'; + await block.mustType(step); + datePicker = await openDatePicker('deadline'); + await datePicker.getByText('Submit').click(); + await validateDatePickerInput('deadline', step); + + await block.enterNext(); + step = 'Test a date entered using the keyboard'; + await block.mustType(step); + datePicker = await openDatePicker('date'); + await page.keyboard.press('Enter'); + await validateDatePickerInput('date', step ); + + // await block.enterNext() + // await page.waitForTimeout(500) + // await block.escapeEditing() + + // // Open date picker + // await page.click('a.opacity-80') + // await page.waitForTimeout(500) + // expect(page.locator('text=May 2000')).toBeVisible() + // expect(page.locator('td:has-text("6").active')).toBeVisible() + + // // Close date picker + // await page.click('a.opacity-80') + // await page.waitForTimeout(500) +}) From a5c4a11d749cd1222c80739f4c0a97d2628dbe6c Mon Sep 17 00:00:00 2001 From: Kyson Montague Date: Thu, 25 May 2023 14:16:56 -0700 Subject: [PATCH 4/4] Cleanup --- e2e-tests/basic.spec.ts | 20 +++----------------- 1 file changed, 3 insertions(+), 17 deletions(-) diff --git a/e2e-tests/basic.spec.ts b/e2e-tests/basic.spec.ts index bf10a91cee..6864f66dd5 100644 --- a/e2e-tests/basic.spec.ts +++ b/e2e-tests/basic.spec.ts @@ -353,10 +353,9 @@ test('Block content should be preserved when adding a deadline via datepicker', } async function validateDatePickerInput(kind, step) { - // Expect datepicker to disappear + // Expect: // previously edited block to still be in editing mode - // content of block to be complete with scheduled date - // TODO - add expects + // content of block to be complete with scheduled date (if scheduled/deadline) await expect(await block.isEditing()).toBe(true); var content = page.locator('textarea >> nth=0'); @@ -383,24 +382,11 @@ test('Block content should be preserved when adding a deadline via datepicker', await datePicker.getByText('Submit').click(); await validateDatePickerInput('deadline', step); + // Test date picker refocusing await block.enterNext(); step = 'Test a date entered using the keyboard'; await block.mustType(step); datePicker = await openDatePicker('date'); await page.keyboard.press('Enter'); await validateDatePickerInput('date', step ); - - // await block.enterNext() - // await page.waitForTimeout(500) - // await block.escapeEditing() - - // // Open date picker - // await page.click('a.opacity-80') - // await page.waitForTimeout(500) - // expect(page.locator('text=May 2000')).toBeVisible() - // expect(page.locator('td:has-text("6").active')).toBeVisible() - - // // Close date picker - // await page.click('a.opacity-80') - // await page.waitForTimeout(500) })