diff --git a/apps/web/__e2e__/models/editor.model.ts b/apps/web/__e2e__/models/editor.model.ts index 1082a1b7e..f5cabcf32 100644 --- a/apps/web/__e2e__/models/editor.model.ts +++ b/apps/web/__e2e__/models/editor.model.ts @@ -38,6 +38,7 @@ export class EditorModel { private readonly tabsList: Locator; private readonly goBackButton: Locator; private readonly goForwardButton: Locator; + private readonly newTabButton: Locator; readonly savedIcon: Locator; readonly notSavedIcon: Locator; @@ -63,6 +64,7 @@ export class EditorModel { this.tabsList = page.locator(getTestId("tabs")); this.goBackButton = page.locator(getTestId("go-back")); this.goForwardButton = page.locator(getTestId("go-forward")); + this.newTabButton = page.locator(getTestId("new-tab")); } async waitForLoading(title?: string, content?: string) { @@ -263,6 +265,10 @@ export class EditorModel { await this.goForwardButton.click(); } + async newTab() { + await this.newTabButton.click(); + } + async attachImage() { await this.page .context() diff --git a/apps/web/__e2e__/tabs.test.ts b/apps/web/__e2e__/tabs.test.ts index 3b22b1081..15ce49803 100644 --- a/apps/web/__e2e__/tabs.test.ts +++ b/apps/web/__e2e__/tabs.test.ts @@ -111,3 +111,16 @@ test("go forward should open next note", async ({ page }) => { await notes.editor.goForward(); expect(await tabs[0].title()).toBe("Note 3"); }); + +test("new tab button should open a new tab", async ({ page }) => { + const app = new AppModel(page); + await app.goto(); + const notes = await app.goToNotes(); + await notes.createNote({ title: "Note 1" }); + + await notes.editor.newTab(); + + const tabs = await notes.editor.getTabs(); + expect(await tabs[0].title()).toBe("Note 1"); + expect(await tabs[1].title()).toBe("Untitled"); +}); diff --git a/apps/web/src/components/editor/action-bar.tsx b/apps/web/src/components/editor/action-bar.tsx index 66fa0deca..b09ac4226 100644 --- a/apps/web/src/components/editor/action-bar.tsx +++ b/apps/web/src/components/editor/action-bar.tsx @@ -443,6 +443,7 @@ function TabStrip() { variant="secondary" sx={{ p: 1, bg: "transparent", alignSelf: "center", ml: 1 }} onClick={() => useEditorStore.getState().addTab()} + data-test-id="new-tab" >