Skip to content

Commit 0a86dc5

Browse files
nhudinh0309nhudinh0309
authored
V15 QA Added acceptance tests for the Content with Tiptap (#17851)
* Added tests for content with tiptap - not done * Updated tests - not done * Addes tests for create content with non-empty RTE tiptap * Added Content tests for tiptap * Cleaned up * Updated tests for Content with tiptap due to test helper changes * Make all the Content tests run in the pipeline * Fixed comment * Reverted
1 parent a954051 commit 0a86dc5

File tree

1 file changed

+143
-0
lines changed

1 file changed

+143
-0
lines changed

‎tests/Umbraco.Tests.AcceptanceTest/tests/DefaultConfig/Content/ContentWithTiptap.spec.ts‎

Lines changed: 143 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,143 @@
1+
import {ConstantHelper, NotificationConstantHelper, test} from '@umbraco/playwright-testhelpers';
2+
import {expect} from "@playwright/test";
3+
4+
const contentName = 'TestContent';
5+
const documentTypeName = 'TestDocumentTypeForContent';
6+
const customDataTypeName = 'Test RTE Tiptap';
7+
let customDataTypeId = null;
8+
9+
test.beforeEach(async ({umbracoApi}) => {
10+
customDataTypeId = await umbracoApi.dataType.createDefaultTiptapDataType(customDataTypeName);
11+
await umbracoApi.documentType.ensureNameNotExists(documentTypeName);
12+
await umbracoApi.document.ensureNameNotExists(contentName);
13+
});
14+
15+
test.afterEach(async ({umbracoApi}) => {
16+
await umbracoApi.document.ensureNameNotExists(contentName);
17+
await umbracoApi.documentType.ensureNameNotExists(documentTypeName);
18+
await umbracoApi.dataType.ensureNameNotExists(customDataTypeName);
19+
});
20+
21+
test('can create content with empty RTE Tiptap property editor', async ({umbracoApi, umbracoUi}) => {
22+
// Arrange
23+
const expectedState = 'Draft';
24+
await umbracoApi.documentType.createDocumentTypeWithPropertyEditor(documentTypeName, customDataTypeName, customDataTypeId);
25+
await umbracoUi.goToBackOffice();
26+
await umbracoUi.content.goToSection(ConstantHelper.sections.content);
27+
28+
// Act
29+
await umbracoUi.content.clickActionsMenuAtRoot();
30+
await umbracoUi.content.clickCreateButton();
31+
await umbracoUi.content.chooseDocumentType(documentTypeName);
32+
await umbracoUi.content.enterContentName(contentName);
33+
await umbracoUi.content.clickSaveButton();
34+
35+
// Assert
36+
await umbracoUi.content.doesSuccessNotificationHaveText(NotificationConstantHelper.success.created);
37+
expect(await umbracoApi.document.doesNameExist(contentName)).toBeTruthy();
38+
const contentData = await umbracoApi.document.getByName(contentName);
39+
expect(contentData.variants[0].state).toBe(expectedState);
40+
expect(contentData.values).toEqual([]);
41+
});
42+
43+
test('can create content with non-empty RTE Tiptap property editor', async ({umbracoApi, umbracoUi}) => {
44+
// Arrange
45+
const expectedState = 'Draft';
46+
const inputText = 'Test Tiptap here';
47+
await umbracoApi.documentType.createDocumentTypeWithPropertyEditor(documentTypeName, customDataTypeName, customDataTypeId);
48+
await umbracoUi.goToBackOffice();
49+
await umbracoUi.content.goToSection(ConstantHelper.sections.content);
50+
51+
// Act
52+
await umbracoUi.content.clickActionsMenuAtRoot();
53+
await umbracoUi.content.clickCreateButton();
54+
await umbracoUi.content.chooseDocumentType(documentTypeName);
55+
await umbracoUi.content.enterContentName(contentName);
56+
await umbracoUi.content.enterRTETipTapEditor(inputText);
57+
await umbracoUi.content.clickSaveButton();
58+
59+
// Assert
60+
await umbracoUi.content.doesSuccessNotificationHaveText(NotificationConstantHelper.success.created);
61+
expect(await umbracoApi.document.doesNameExist(contentName)).toBeTruthy();
62+
const contentData = await umbracoApi.document.getByName(contentName);
63+
expect(contentData.variants[0].state).toBe(expectedState);
64+
expect(contentData.values[0].value.markup).toEqual('<p>' + inputText + '</p>');
65+
});
66+
67+
test('can publish content with RTE Tiptap property editor', async ({umbracoApi, umbracoUi}) => {
68+
// Arrange
69+
const expectedState = 'Published';
70+
const inputText = 'Test Tiptap here';
71+
const documentTypeId = await umbracoApi.documentType.createDocumentTypeWithPropertyEditor(documentTypeName, customDataTypeName, customDataTypeId);
72+
await umbracoApi.document.createDefaultDocument(contentName, documentTypeId);
73+
await umbracoUi.goToBackOffice();
74+
await umbracoUi.content.goToSection(ConstantHelper.sections.content);
75+
76+
// Act
77+
await umbracoUi.content.goToContentWithName(contentName);
78+
await umbracoUi.content.enterRTETipTapEditor(inputText);
79+
await umbracoUi.content.clickSaveAndPublishButton();
80+
81+
// Assert
82+
await umbracoUi.content.doesSuccessNotificationsHaveCount(2);
83+
expect(await umbracoApi.document.doesNameExist(contentName)).toBeTruthy();
84+
const contentData = await umbracoApi.document.getByName(contentName);
85+
expect(contentData.variants[0].state).toBe(expectedState);
86+
expect(contentData.values[0].value.markup).toEqual('<p>' + inputText + '</p>');
87+
});
88+
89+
test('can add a media in RTE Tiptap property editor', async ({umbracoApi, umbracoUi}) => {
90+
// Arrange
91+
const iconTitle = 'Media picker';
92+
const imageName = 'Test Image For Content';
93+
await umbracoApi.media.ensureNameNotExists(imageName);
94+
await umbracoApi.media.createDefaultMediaWithImage(imageName);
95+
const documentTypeId = await umbracoApi.documentType.createDocumentTypeWithPropertyEditor(documentTypeName, customDataTypeName, customDataTypeId);
96+
await umbracoApi.document.createDefaultDocument(contentName, documentTypeId);
97+
await umbracoUi.goToBackOffice();
98+
await umbracoUi.content.goToSection(ConstantHelper.sections.content);
99+
100+
// Act
101+
await umbracoUi.content.goToContentWithName(contentName);
102+
await umbracoUi.content.clickTipTapToolbarIconWithTitle(iconTitle);
103+
await umbracoUi.content.selectMediaWithName(imageName);
104+
await umbracoUi.content.clickSubmitButton();
105+
await umbracoUi.content.clickMediaCaptionAltTextModalSubmitButton();
106+
await umbracoUi.content.clickSaveButton();
107+
108+
// Assert
109+
await umbracoUi.content.doesSuccessNotificationHaveText(NotificationConstantHelper.success.saved);
110+
expect(await umbracoApi.document.doesNameExist(contentName)).toBeTruthy();
111+
const contentData = await umbracoApi.document.getByName(contentName);
112+
expect(contentData.values[0].value.markup).toContain('<img');
113+
expect(contentData.values[0].value.markup).toContain(imageName);
114+
115+
// Clean
116+
await umbracoApi.media.ensureNameNotExists(imageName);
117+
});
118+
119+
test('can add a video in RTE Tiptap property editor', async ({umbracoApi, umbracoUi}) => {
120+
// Arrange
121+
const iconTitle = 'Embed';
122+
const videoURL = 'https://www.youtube.com/watch?v=Yu29dE-0OoI';
123+
const documentTypeId = await umbracoApi.documentType.createDocumentTypeWithPropertyEditor(documentTypeName, customDataTypeName, customDataTypeId);
124+
await umbracoApi.document.createDefaultDocument(contentName, documentTypeId);
125+
await umbracoUi.goToBackOffice();
126+
await umbracoUi.content.goToSection(ConstantHelper.sections.content);
127+
128+
// Act
129+
await umbracoUi.content.goToContentWithName(contentName);
130+
await umbracoUi.content.clickTipTapToolbarIconWithTitle(iconTitle);
131+
await umbracoUi.content.enterEmbeddedURL(videoURL);
132+
await umbracoUi.content.clickEmbeddedRetrieveButton();
133+
await umbracoUi.content.waitForEmbeddedPreviewVisible();
134+
await umbracoUi.content.clickEmbeddedMediaModalConfirmButton();
135+
await umbracoUi.content.clickSaveButton();
136+
137+
// Assert
138+
await umbracoUi.content.doesSuccessNotificationHaveText(NotificationConstantHelper.success.saved);
139+
expect(await umbracoApi.document.doesNameExist(contentName)).toBeTruthy();
140+
const contentData = await umbracoApi.document.getByName(contentName);
141+
expect(contentData.values[0].value.markup).toContain('data-embed-url');
142+
expect(contentData.values[0].value.markup).toContain(videoURL);
143+
});

0 commit comments

Comments
 (0)