diff --git a/e2e/time.spec.ts b/e2e/time.spec.ts index a21682d6..82e5f5ab 100644 --- a/e2e/time.spec.ts +++ b/e2e/time.spec.ts @@ -1,6 +1,6 @@ import { PLAYWRIGHT_BASE_URL } from '../playwright/config'; import { test } from '../playwright/fixtures'; -import { expect, Page } from '@playwright/test'; +import { expect, Locator, Page } from '@playwright/test'; import { assertThatTimerHasStarted, assertThatTimerIsStopped, @@ -23,8 +23,13 @@ async function createEmptyTimeEntry(page: Page) { await Promise.all([ stoppedTimeEntryResponse(page), startOrStopTimerWithButton(page), + assertThatTimerIsStopped(page), + page.waitForResponse( + (response) => + response.url().includes('/time-entries') && + response.status() === 200 + ), ]); - await assertThatTimerIsStopped(page); } test('test that starting and stopping an empty time entry shows a new time entry in the overview', async ({ @@ -49,20 +54,27 @@ test('test that starting and stopping an empty time entry shows a new time entry // Test that description update works +async function assertThatTimeEntryRowIsStopped(newTimeEntry: Locator) { + await expect(newTimeEntry.getByTestId('timer_button')).toHaveClass( + /bg-accent-300\/50/ + ); +} + +async function assertThatTimeEntryRowIsStarted(newTimeEntry: Locator) { + await expect(newTimeEntry.getByTestId('timer_button')).toHaveClass( + /bg-red-400\/80/ + ); +} + test('test that updating a description of a time entry in the overview works on blur', async ({ page, }) => { await goToTimeOverview(page); const timeEntryRows = page.locator('[data-testid="time_entry_row"]'); await createEmptyTimeEntry(page); - await page.waitForResponse( - (response) => - response.url().includes('/time-entries') && - response.status() === 200 - ); - const newTimeEntry = timeEntryRows.first(); - await newTimeEntry.locator('[data-testid="timer_button"].bg-accent-300/70'); + await assertThatTimeEntryRowIsStopped(newTimeEntry); + const newDescription = Math.floor(Math.random() * 1000000).toString(); const descriptionElement = newTimeEntry.getByTestId( 'time_entry_description' @@ -96,14 +108,9 @@ test('test that updating a description of a time entry in the overview works on await goToTimeOverview(page); const timeEntryRows = page.locator('[data-testid="time_entry_row"]'); await createEmptyTimeEntry(page); - await page.waitForResponse( - (response) => - response.url().includes('/time-entries') && - response.status() === 200 - ); const newTimeEntry = timeEntryRows.first(); - await newTimeEntry.locator('[data-testid="timer_button"].bg-accent-300/70'); + await assertThatTimeEntryRowIsStopped(newTimeEntry); const newDescription = Math.floor(Math.random() * 1000000).toString(); const descriptionElement = newTimeEntry.getByTestId( 'time_entry_description' @@ -137,20 +144,15 @@ test('test that adding a new tag to an existing time entry works', async ({ await goToTimeOverview(page); const timeEntryRows = page.locator('[data-testid="time_entry_row"]'); await createEmptyTimeEntry(page); - await page.waitForResponse( - (response) => - response.url().includes('/time-entries') && - response.status() === 200 - ); const newTimeEntry = timeEntryRows.first(); - await newTimeEntry.locator('[data-testid="timer_button"].bg-accent-300/70'); + await assertThatTimeEntryRowIsStopped(newTimeEntry); const newTagName = Math.floor(Math.random() * 1000000).toString(); await newTimeEntry.getByTestId('time_entry_tag_dropdown').click(); await newTimeEntry.getByTestId('tag_dropdown_search').fill(newTagName); - await Promise.all([ + const [tagReponse] = await Promise.all([ page.waitForResponse(async (response) => { return ( response.status() === 201 && @@ -162,6 +164,19 @@ test('test that adding a new tag to an existing time entry works', async ({ newTimeEntry.getByTestId('tag_dropdown_search').press('Enter'), ]); + await page.waitForResponse(async (response) => { + return ( + response.status() === 200 && + (await response.headerValue('Content-Type')) === + 'application/json' && + (await response.json()).data.id !== null && + (await response.json()).data.start !== null && + (await response.json()).data.end !== null && + JSON.stringify((await response.json()).data.tags) === + JSON.stringify([(await tagReponse.json()).data.id]) + ); + }); + await expect(newTimeEntry.getByTestId('tag_dropdown_search')).toHaveValue( '' ); @@ -177,14 +192,9 @@ test('test that updating a the start of an existing time entry in the overview w await goToTimeOverview(page); const timeEntryRows = page.locator('[data-testid="time_entry_row"]'); await createEmptyTimeEntry(page); - await page.waitForResponse( - (response) => - response.url().includes('/time-entries') && - response.status() === 200 - ); const newTimeEntry = timeEntryRows.first(); - await newTimeEntry.locator('[data-testid="timer_button"].bg-accent-300/70'); + await assertThatTimeEntryRowIsStopped(newTimeEntry); await page.waitForTimeout(1500); const timeEntryRangeElement = newTimeEntry.getByTestId( 'time_entry_range_selector' @@ -223,14 +233,9 @@ test('test that updating a the duration in the overview works on blur', async ({ await goToTimeOverview(page); const timeEntryRows = page.locator('[data-testid="time_entry_row"]'); await createEmptyTimeEntry(page); - await page.waitForResponse( - (response) => - response.url().includes('/time-entries') && - response.status() === 200 - ); const newTimeEntry = timeEntryRows.first(); - await newTimeEntry.locator('[data-testid="timer_button"].bg-accent-300/70'); + await assertThatTimeEntryRowIsStopped(newTimeEntry); await page.waitForTimeout(1500); const timeEntryDurationInput = newTimeEntry.getByTestId( 'time_entry_duration_input' @@ -278,7 +283,7 @@ test('test that stopping a time entry from the overview works', async ({ const newTimeEntry = timeEntryRows.first(); const stopButton = newTimeEntry.getByTestId('timer_button'); - await newTimeEntry.locator('[data-testid="timer_button"].bg-red-400/80'); + await assertThatTimeEntryRowIsStarted(newTimeEntry); await Promise.all([ page.waitForResponse(async (response) => { @@ -306,11 +311,6 @@ test('test that starting a time entry from the overview works', async ({ await goToTimeOverview(page); const timeEntryRows = page.locator('[data-testid="time_entry_row"]'); await createEmptyTimeEntry(page); - await page.waitForResponse( - (response) => - response.url().includes('/time-entries') && - response.status() === 200 - ); const newTimeEntry = timeEntryRows.first(); const startButton = newTimeEntry.getByTestId('timer_button'); @@ -414,11 +414,6 @@ test('test that deleting a time entry from the overview works', async ({ await goToTimeOverview(page); const timeEntryRows = page.locator('[data-testid="time_entry_row"]'); await createEmptyTimeEntry(page); - await page.waitForResponse( - (response) => - response.url().includes('/time-entries') && - response.status() === 200 - ); const timeEntryCount = await timeEntryRows.count(); const newTimeEntry = timeEntryRows.first(); diff --git a/e2e/utils/currentTimeEntry.ts b/e2e/utils/currentTimeEntry.ts index 037c6652..c64ccf99 100644 --- a/e2e/utils/currentTimeEntry.ts +++ b/e2e/utils/currentTimeEntry.ts @@ -1,4 +1,4 @@ -import { Page } from '@playwright/test'; +import { expect, Page } from '@playwright/test'; export async function startOrStopTimerWithButton(page: Page) { await page @@ -33,9 +33,11 @@ export function newTimeEntryResponse(page: Page) { } export async function assertThatTimerIsStopped(page: Page) { - await page.locator( - '[data-testid="dashboard_timer"] [data-testid="timer_button"].bg-accent-300/70' - ); + await expect( + page.locator( + '[data-testid="dashboard_timer"] [data-testid="timer_button"]' + ) + ).toHaveClass(/bg-accent-300\/50/); } export async function stoppedTimeEntryResponse(page: Page) {