diff --git a/projects/core/components/notification/notification.style.less b/projects/core/components/notification/notification.style.less index 34add1123ea3..e79b6855795b 100644 --- a/projects/core/components/notification/notification.style.less +++ b/projects/core/components/notification/notification.style.less @@ -79,7 +79,6 @@ .t-content { flex: 1; - word-wrap: break-word; - overflow-wrap: anywhere; + word-break: break-word; color: var(--tui-text-01); } diff --git a/projects/demo-playwright/tests/kit/notification/notification.spec.ts b/projects/demo-playwright/tests/kit/notification/notification.spec.ts new file mode 100644 index 000000000000..c5ffc30f4a36 --- /dev/null +++ b/projects/demo-playwright/tests/kit/notification/notification.spec.ts @@ -0,0 +1,37 @@ +import {TuiDocumentationPagePO, tuiGoto} from '@demo-playwright/utils'; +import {expect, Locator, test} from '@playwright/test'; + +test.describe('Notification', () => { + const viewports = generateDimensions(180, 320, 10); + let example: Locator; + + test.describe('default', () => { + test.beforeEach(async ({page}) => { + await tuiGoto(page, '/components/notification/API'); + + example = new TuiDocumentationPagePO(page).apiPageExample; + }); + + viewports.forEach(({width, height}) => { + test(`width: ${width}`, async ({page}) => { + await page.setViewportSize({width, height}); + await expect(example).toHaveScreenshot(`01-notification-${width}.png`); + }); + }); + }); +}); + +interface Dimensions { + width: number; + height: number; +} + +function generateDimensions(start: number, end: number, step: number): Dimensions[] { + const viewports: Dimensions[] = []; + + for (let width = start; width <= end; width += step) { + viewports.push({width, height: 500}); + } + + return viewports; +}