mirror of https://github.com/nocodb/nocodb
319 lines
7.8 KiB
319 lines
7.8 KiB
import { Page, test } from '@playwright/test'; |
|
import { BaseType, ProjectTypes } from 'nocodb-sdk'; |
|
import { DashboardPage } from '../../pages/Dashboard'; |
|
import setup, { NcContext } from '../../setup'; |
|
|
|
test.describe('Tiptap:Keyboard shortcuts and drag and drop', () => { |
|
let dashboard: DashboardPage; |
|
let context: NcContext; |
|
let base: BaseType; |
|
|
|
test.beforeEach(async ({ page }) => { |
|
context = await setup({ page, baseType: ProjectTypes.DOCUMENTATION }); |
|
base = context.base; |
|
dashboard = new DashboardPage(page, context.base); |
|
}); |
|
|
|
test('Tiptap:Drag and drop', async ({ page }) => { |
|
const openedPage = await dashboard.docs.openedPage; |
|
await dashboard.sidebar.docsSidebar.createPage({ |
|
baseTitle: base.title as any, |
|
title: 'page', |
|
}); |
|
|
|
await openedPage.tiptap.addNewNode({ |
|
type: 'Heading 1', |
|
index: 0, |
|
}); |
|
await openedPage.tiptap.fillContent({ |
|
content: 'Heading 1 content', |
|
index: 0, |
|
type: 'Heading 1', |
|
}); |
|
|
|
await openedPage.tiptap.addNewNode({ |
|
type: 'Heading 2', |
|
index: 1, |
|
}); |
|
await openedPage.tiptap.fillContent({ |
|
content: 'Heading 2 content', |
|
index: 1, |
|
type: 'Heading 2', |
|
}); |
|
|
|
await openedPage.tiptap.dragToNode({ |
|
fromIndex: 0, |
|
toIndex: 1, |
|
}); |
|
|
|
await openedPage.tiptap.verifyNode({ |
|
index: 0, |
|
type: 'Heading 2', |
|
content: 'Heading 2 content', |
|
}); |
|
|
|
await openedPage.tiptap.verifyNode({ |
|
index: 1, |
|
type: 'Heading 1', |
|
content: 'Heading 1 content', |
|
}); |
|
|
|
await openedPage.tiptap.addNewNode({ |
|
index: 2, |
|
type: 'Image', |
|
filePath: `${process.cwd()}/fixtures/sampleFiles/sampleImage.jpeg`, |
|
}); |
|
await openedPage.tiptap.verifyNode({ |
|
index: 2, |
|
type: 'Image', |
|
isUploading: false, |
|
}); |
|
|
|
await openedPage.tiptap.clickNode({ |
|
index: 2, |
|
start: false, |
|
}); |
|
await openedPage.tiptap.dragToNode({ |
|
fromIndex: 2, |
|
toIndex: 0, |
|
withoutHandle: true, |
|
}); |
|
await openedPage.tiptap.verifyNode({ |
|
index: 0, |
|
type: 'Heading 2', |
|
content: 'Heading 2 content', |
|
}); |
|
await openedPage.tiptap.verifyNode({ |
|
index: 1, |
|
type: 'Image', |
|
isUploading: false, |
|
}); |
|
await openedPage.tiptap.verifyNode({ |
|
index: 2, |
|
type: 'Heading 1', |
|
content: 'Heading 1 content', |
|
}); |
|
}); |
|
|
|
test('Tiptap:Keyboard shortcuts', async ({ page }) => { |
|
const openedPage = await dashboard.docs.openedPage; |
|
await dashboard.sidebar.docsSidebar.createPage({ |
|
baseTitle: base.title as any, |
|
title: 'page', |
|
}); |
|
|
|
await openedPage.tiptap.clickNode({ |
|
index: 0, |
|
start: true, |
|
}); |
|
await page.keyboard.press('Control+Shift+1'); |
|
await openedPage.tiptap.verifyNode({ |
|
index: 0, |
|
type: 'Heading 1', |
|
}); |
|
|
|
await page.waitForTimeout(300); |
|
|
|
await openedPage.tiptap.clickNode({ |
|
index: 0, |
|
start: true, |
|
}); |
|
await page.keyboard.press('Control+Shift+2'); |
|
await openedPage.tiptap.verifyNode({ |
|
index: 0, |
|
type: 'Heading 2', |
|
}); |
|
|
|
await page.waitForTimeout(300); |
|
|
|
await openedPage.tiptap.clickNode({ |
|
index: 0, |
|
start: true, |
|
}); |
|
await page.keyboard.press('Control+Shift+3'); |
|
await openedPage.tiptap.verifyNode({ |
|
index: 0, |
|
type: 'Heading 3', |
|
}); |
|
|
|
await page.waitForTimeout(300); |
|
await openedPage.tiptap.clearContent(); |
|
|
|
await openedPage.tiptap.fillContent({ |
|
content: 'Link content', |
|
index: 0, |
|
}); |
|
await page.waitForTimeout(300); |
|
await openedPage.tiptap.selectNodes({ |
|
start: 0, |
|
end: 0, |
|
}); |
|
await page.waitForTimeout(300); |
|
|
|
await page.keyboard.press('Control+K'); |
|
await openedPage.tiptap.verifyLinkOptionVisible({ |
|
visible: true, |
|
}); |
|
await openedPage.tiptap.verifyLinkNode({ |
|
index: 0, |
|
placeholder: 'Link content', |
|
}); |
|
await page.waitForTimeout(300); |
|
await page.keyboard.press('Enter'); |
|
await openedPage.tiptap.clearContent(); |
|
await page.waitForTimeout(300); |
|
|
|
await openedPage.tiptap.fillContent({ |
|
content: 'Quote content', |
|
index: 0, |
|
}); |
|
await page.waitForTimeout(300); |
|
await page.keyboard.press('Meta+]'); |
|
await openedPage.tiptap.verifyNode({ |
|
index: 0, |
|
type: 'Quote', |
|
content: 'Quote content', |
|
}); |
|
|
|
await openedPage.tiptap.clearContent(); |
|
await page.waitForTimeout(300); |
|
|
|
await openedPage.tiptap.fillContent({ |
|
content: 'Code content', |
|
index: 0, |
|
}); |
|
await page.waitForTimeout(300); |
|
await page.keyboard.press('Alt+Meta+C'); |
|
await openedPage.tiptap.verifyTextFormatting({ |
|
index: 0, |
|
formatType: 'code', |
|
text: 'Code content', |
|
}); |
|
|
|
await openedPage.tiptap.clearContent(); |
|
|
|
await openedPage.tiptap.fillContent({ |
|
index: 0, |
|
content: 'Bullet content', |
|
}); |
|
await page.waitForTimeout(300); |
|
await page.keyboard.press('Control+Alt+2'); |
|
await openedPage.tiptap.verifyNode({ |
|
index: 0, |
|
type: 'Bullet List', |
|
content: 'Bullet content', |
|
}); |
|
|
|
await openedPage.tiptap.clearContent(); |
|
await page.waitForTimeout(300); |
|
|
|
await openedPage.tiptap.fillContent({ |
|
index: 0, |
|
content: 'Numbered content', |
|
}); |
|
await page.waitForTimeout(300); |
|
await page.keyboard.press('Control+Alt+3'); |
|
await openedPage.tiptap.verifyNode({ |
|
index: 0, |
|
type: 'Numbered List', |
|
content: 'Numbered content', |
|
}); |
|
|
|
await openedPage.tiptap.clearContent(); |
|
await page.waitForTimeout(300); |
|
|
|
await openedPage.tiptap.fillContent({ |
|
index: 0, |
|
content: 'Todo content', |
|
}); |
|
|
|
await page.waitForTimeout(300); |
|
await page.keyboard.press('Control+Alt+1'); |
|
await openedPage.tiptap.verifyNode({ |
|
index: 0, |
|
type: 'Task List', |
|
content: 'Todo content', |
|
}); |
|
|
|
await openedPage.tiptap.clearContent(); |
|
await page.waitForTimeout(300); |
|
|
|
await page.keyboard.press('Control+Shift+H'); |
|
await openedPage.tiptap.verifyNode({ |
|
index: 0, |
|
type: 'Divider', |
|
}); |
|
}); |
|
|
|
test('Tiptap:Keyboard shortcuts selection', async ({ page }) => { |
|
const openedPage = await dashboard.docs.openedPage; |
|
await dashboard.sidebar.docsSidebar.createPage({ |
|
baseTitle: base.title as any, |
|
title: 'page', |
|
}); |
|
|
|
// Cmd + Left |
|
await openedPage.tiptap.fillContent({ |
|
content: 'Content 1', |
|
}); |
|
await openedPage.tiptap.verifyNode({ |
|
content: 'Content 1', |
|
index: 0, |
|
}); |
|
|
|
await page.keyboard.press('Meta+ArrowLeft'); |
|
|
|
// Cmd + Shift + Right |
|
await page.waitForTimeout(300); |
|
await page.keyboard.press('Shift+Meta+ArrowRight'); |
|
await page.waitForTimeout(300); |
|
|
|
await page.keyboard.press('Delete'); |
|
await page.waitForTimeout(300); |
|
|
|
await openedPage.tiptap.fillContent({ |
|
index: 0, |
|
content: 'New Content 1', |
|
}); |
|
await openedPage.tiptap.verifyNode({ |
|
content: 'New Content 1', |
|
index: 0, |
|
}); |
|
|
|
await page.keyboard.press('Meta+ArrowLeft'); |
|
await page.waitForTimeout(300); |
|
|
|
// Cmd + Right |
|
await page.keyboard.press('Meta+ArrowRight'); |
|
await page.waitForTimeout(300); |
|
|
|
// Cmd + Shift + Left |
|
await page.keyboard.press('Shift+Meta+ArrowLeft'); |
|
await page.waitForTimeout(300); |
|
|
|
await page.keyboard.press('Delete'); |
|
await page.waitForTimeout(300); |
|
|
|
await openedPage.tiptap.fillContent({ |
|
index: 0, |
|
content: 'New New Content 1', |
|
}); |
|
await openedPage.tiptap.verifyNode({ |
|
content: 'New New Content 1', |
|
index: 0, |
|
}); |
|
|
|
// Cmd + Backspace |
|
await page.keyboard.press('Meta+Backspace'); |
|
await page.waitForTimeout(300); |
|
|
|
await openedPage.tiptap.fillContent({ |
|
index: 0, |
|
content: 'New New New Content 1', |
|
}); |
|
await openedPage.tiptap.verifyNode({ |
|
content: 'New New New Content 1', |
|
index: 0, |
|
}); |
|
}); |
|
});
|
|
|