Skip to content

Commit

Permalink
test(playwright-ct): add tests for advanced keyboard editing with the…
Browse files Browse the repository at this point in the history
… Portable Text Input
  • Loading branch information
skogsmaskin committed Dec 13, 2024
1 parent 0fd20f5 commit 1adfba8
Show file tree
Hide file tree
Showing 3 changed files with 44 additions and 0 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -48,8 +48,25 @@ test.describe('Portable Text Input', () => {
// Expect the editor to have focus after closing the popover
await expect($pte).toBeFocused()

const $toolbarPopover = page.getByTestId('annotation-toolbar-popover')

// Assertion: the annotation toolbar popover should be visible
await expect(page.getByTestId('annotation-toolbar-popover')).toBeVisible()
await expect($toolbarPopover).toBeVisible()

// Assertion: tab works to get to the toolbar popover buttons
await page.keyboard.press('Tab')
await expect(page.getByTestId('edit-annotation-button')).toBeFocused()
await page.keyboard.press('Tab')
await expect(page.getByTestId('remove-annotation-button')).toBeFocused()
await page.keyboard.press('Escape')
await expect($pte).toBeFocused()
await expect($toolbarPopover).toBeVisible()
await page.waitForTimeout(100)
await page.keyboard.press('Escape')
await page.waitForTimeout(100)
// Assertion: escape closes the toolbar popover
await expect($toolbarPopover).not.toBeVisible()
})

test('Can create, and then open the existing annotation again for editing', async ({
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -117,6 +117,7 @@ test.describe('Portable Text Input', () => {
const $portableTextInput = component.getByTestId('field-body')
const $pteTextbox = $portableTextInput.getByRole('textbox')
await expect($pteTextbox).not.toBeFocused()
await page.keyboard.press('Tab+Tab')
const blockObjectInput = page.getByTestId('objectBlockInputField').getByRole('textbox')
await expect(blockObjectInput).toBeFocused()
})
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -30,6 +30,32 @@ test.describe('Portable Text Input', () => {
await expect($pte.getByText('Custom preview block:')).toBeVisible()
})

test('Inline object toolbars works as expected', async ({mount, page}) => {
const {getFocusedPortableTextEditor} = testHelpers({page})
await mount(<ObjectBlockStory />)
const $pte = await getFocusedPortableTextEditor('field-body')
await page.getByRole('button', {name: 'Insert Inline Object (inline)'}).click()
// Assertion: the annotation toolbar popover should not be visible
await expect(page.getByTestId('inline-object-toolbar-popover')).not.toBeVisible()
const $locatorDialog = page.getByTestId('popover-edit-dialog')
// Assertion: Object edit dialog should be visible
await expect($locatorDialog).toBeVisible()
await page.keyboard.press('Escape')
// Assertion: the annotation toolbar popover should be visible
await expect(page.getByTestId('inline-object-toolbar-popover')).toBeVisible()
// Assertion: tab works to get to the toolbar popover buttons
await page.keyboard.press('Tab')
await expect(page.getByTestId('edit-inline-object-button')).toBeFocused()
await page.keyboard.press('Tab')
await expect(page.getByTestId('remove-inline-object-button')).toBeFocused()
await page.keyboard.press('Escape')
await expect(page.getByTestId('edit-inline-object-button')).toBeVisible()
await expect($pte).toBeFocused()
await page.keyboard.press('Escape')
// Assertion: escape closes the toolbar popover
await expect(page.getByTestId('inline-object-toolbar-popover')).not.toBeVisible()
})

test('Double-clicking opens a block', async ({mount, page}) => {
const {getFocusedPortableTextEditor} = testHelpers({page})
await mount(<ObjectBlockStory />)
Expand Down

0 comments on commit 1adfba8

Please sign in to comment.