V14 Added the Content tests with Textarea, Textstring, TrueFalse datatype (#16946)

* Added Contents test with Textarea

* Added Content tests with textstring

* Removed the tests for Textarea property editor

* Added Content tests for TrueFalse data type

* Bumped version of test helper

* Make all Content tests run in the pipeline

* Cleaned code

* Make the smoke tests run in the pipeline

tests/Umbraco.Tests.AcceptanceTest/package-lock.json

@@ -7,8 +7,8 @@
       "name": "acceptancetest",
       "hasInstallScript": true,
       "dependencies": {
-        "@umbraco/json-models-builders": "^2.0.15",
-        "@umbraco/playwright-testhelpers": "^2.0.0-beta.74",
+        "@umbraco/json-models-builders": "^2.0.17",
+        "@umbraco/playwright-testhelpers": "^2.0.0-beta.76",
         "camelize": "^1.0.0",
         "dotenv": "^16.3.1",
         "faker": "^4.1.0",
@@ -132,19 +132,19 @@
       }
     },
     "node_modules/@umbraco/json-models-builders": {
-      "version": "2.0.15",
-      "resolved": "https://registry.npmjs.org/@umbraco/json-models-builders/-/json-models-builders-2.0.15.tgz",
-      "integrity": "sha512-+YT/9wr6zu2+agCLDw12ZPiqLpa2BT5/q90Lh5TZAlrhRRpGITDxMFkFMu1+7Z9bsmxHC/9VN+phN+sinF9BGQ==",
+      "version": "2.0.17",
+      "resolved": "https://registry.npmjs.org/@umbraco/json-models-builders/-/json-models-builders-2.0.17.tgz",
+      "integrity": "sha512-i7uuojDjWuXkch9XkEClGtlKJ0Lw3BTGpp4qKaUM+btb7g1sn1Gi50+f+478cJvLG6+q6rmQDZCIXqrTU6Ryhg==",
       "dependencies": {
         "camelize": "^1.0.1"
       }
     },
     "node_modules/@umbraco/playwright-testhelpers": {
-      "version": "2.0.0-beta.74",
-      "resolved": "https://registry.npmjs.org/@umbraco/playwright-testhelpers/-/playwright-testhelpers-2.0.0-beta.74.tgz",
-      "integrity": "sha512-TgmASLfTCyEMqGDVi3ky9S2gKR33wjcTjZpNIWcNGBSJAsmBQWaJur+3/iMlIVH1oO4hMuYpDvjLuaXZCbFRCw==",
+      "version": "2.0.0-beta.76",
+      "resolved": "https://registry.npmjs.org/@umbraco/playwright-testhelpers/-/playwright-testhelpers-2.0.0-beta.76.tgz",
+      "integrity": "sha512-wXAG70dqFvzCL0XWd+/8dhDoNtWvGzBmOfg5HAkwxHkQ0YvloeZSVPBd2Ji2WWRtFiK07CAvCKibnbCOeBkYVg==",
       "dependencies": {
-        "@umbraco/json-models-builders": "2.0.15",
+        "@umbraco/json-models-builders": "2.0.17",
         "node-fetch": "^2.6.7"
       }
     },

tests/Umbraco.Tests.AcceptanceTest/package.json

@@ -21,8 +21,8 @@
     "wait-on": "^7.2.0"
   },
   "dependencies": {
-    "@umbraco/json-models-builders": "^2.0.15",
-    "@umbraco/playwright-testhelpers": "^2.0.0-beta.74",
+    "@umbraco/json-models-builders": "^2.0.17",
+    "@umbraco/playwright-testhelpers": "^2.0.0-beta.76",
     "camelize": "^1.0.0",
     "dotenv": "^16.3.1",
     "faker": "^4.1.0",

tests/Umbraco.Tests.AcceptanceTest/tests/DefaultConfig/Content/ContentInfoTab.spec.ts

@@ -1,4 +1,4 @@
-import { expect } from '@playwright/test';
+import {expect} from '@playwright/test';
 import {ConstantHelper, test} from '@umbraco/playwright-testhelpers';
 
 let documentTypeId = '';

tests/Umbraco.Tests.AcceptanceTest/tests/DefaultConfig/Content/ContentWithCheckboxList.spec.ts

@@ -1,4 +1,4 @@
-import { ConstantHelper, test, AliasHelper } from '@umbraco/playwright-testhelpers';
+import {ConstantHelper, test, AliasHelper} from '@umbraco/playwright-testhelpers';
 import {expect} from "@playwright/test";
 
 const contentName = 'TestContent';

tests/Umbraco.Tests.AcceptanceTest/tests/DefaultConfig/Content/ContentWithDropdown.spec.ts

@@ -1,4 +1,4 @@
-import { ConstantHelper, test, AliasHelper } from '@umbraco/playwright-testhelpers';
+import {ConstantHelper, test, AliasHelper} from '@umbraco/playwright-testhelpers';
 import {expect} from "@playwright/test";
 
 const contentName = 'TestContent';

tests/Umbraco.Tests.AcceptanceTest/tests/DefaultConfig/Content/ContentWithMediaPicker.spec.ts

@@ -1,4 +1,4 @@
-import { ConstantHelper, test, AliasHelper } from '@umbraco/playwright-testhelpers';
+import {ConstantHelper, test, AliasHelper} from '@umbraco/playwright-testhelpers';
 import {expect} from "@playwright/test";
 
 const dataTypeName = 'Media Picker';

tests/Umbraco.Tests.AcceptanceTest/tests/DefaultConfig/Content/ContentWithMultipleMediaPicker.spec.ts

@@ -1,4 +1,4 @@
-import { ConstantHelper, test, AliasHelper } from '@umbraco/playwright-testhelpers';
+import {ConstantHelper, test, AliasHelper} from '@umbraco/playwright-testhelpers';
 import {expect} from "@playwright/test";
 
 const dataTypeName = 'Multiple Media Picker';

tests/Umbraco.Tests.AcceptanceTest/tests/DefaultConfig/Content/ContentWithPropertyEditors.spec.ts

@@ -47,30 +47,6 @@ test('can create content with the Rich Text Editor datatype', {tag: '@smoke'}, a
   expect(contentData.values[0].value).toEqual(expectedContentValue);
 });
 
-test('can create content with the text area datatype', async ({umbracoApi, umbracoUi}) => {
-  // Arrange
-  const dataTypeName = 'Textarea';
-  const contentText = 'This is Textarea content!';
-  const dataTypeData = await umbracoApi.dataType.getByName(dataTypeName);
-  await umbracoApi.documentType.createDocumentTypeWithPropertyEditor(documentTypeName, dataTypeName, dataTypeData.id);
-  await umbracoUi.goToBackOffice();
-  await umbracoUi.content.goToSection(ConstantHelper.sections.content);
-
-  // Act
-  await umbracoUi.content.clickActionsMenuAtRoot();
-  await umbracoUi.content.clickCreateButton();
-  await umbracoUi.content.chooseDocumentType(documentTypeName);
-  await umbracoUi.content.enterContentName(contentName);
-  await umbracoUi.content.enterTextArea(contentText);
-  await umbracoUi.content.clickSaveAndPublishButton();
-
-  // Assert
-  await umbracoUi.content.doesSuccessNotificationsHaveCount(2);
-  expect(await umbracoApi.document.doesNameExist(contentName)).toBeTruthy();
-  const contentData = await umbracoApi.document.getByName(contentName);
-  expect(contentData.values[0].value).toEqual(contentText);
-});
-
 // TODO: Remove skip when the front-end is ready. Currently it returns error when publishing a content
 test.skip('can create content with the upload file datatype', async ({umbracoApi, umbracoUi}) => {
   // Arrange

tests/Umbraco.Tests.AcceptanceTest/tests/DefaultConfig/Content/ContentWithRadiobox.spec.ts

@@ -1,4 +1,4 @@
-import { ConstantHelper, test, AliasHelper } from '@umbraco/playwright-testhelpers';
+import {ConstantHelper, test, AliasHelper} from '@umbraco/playwright-testhelpers';
 import {expect} from "@playwright/test";
 
 const contentName = 'TestContent';

tests/Umbraco.Tests.AcceptanceTest/tests/DefaultConfig/Content/ContentWithTextarea.spec.ts

@@ -0,0 +1,104 @@
+import {ConstantHelper, test, AliasHelper} from '@umbraco/playwright-testhelpers';
+import {expect} from "@playwright/test";
+
+const contentName = 'TestContent';
+const documentTypeName = 'TestDocumentTypeForContent';
+const dataTypeName = 'Textarea';
+const text = 'This is the content with textarea';
+const customDataTypeName = 'Custom Textarea';
+
+test.beforeEach(async ({umbracoApi, umbracoUi}) => {
+  await umbracoApi.documentType.ensureNameNotExists(documentTypeName);
+  await umbracoApi.document.ensureNameNotExists(contentName);
+  await umbracoUi.goToBackOffice();
+});
+
+test.afterEach(async ({umbracoApi}) => {
+  await umbracoApi.document.ensureNameNotExists(contentName); 
+  await umbracoApi.documentType.ensureNameNotExists(documentTypeName);
+});
+
+test('can create content with the textarea data type', async ({umbracoApi, umbracoUi}) => {
+  // Arrange
+  const expectedState = 'Draft';
+  const dataTypeData = await umbracoApi.dataType.getByName(dataTypeName);
+  await umbracoApi.documentType.createDocumentTypeWithPropertyEditor(documentTypeName, dataTypeName, dataTypeData.id);
+  await umbracoUi.content.goToSection(ConstantHelper.sections.content);
+
+  // Act
+  await umbracoUi.content.clickActionsMenuAtRoot();
+  await umbracoUi.content.clickCreateButton();
+  await umbracoUi.content.chooseDocumentType(documentTypeName);
+  await umbracoUi.content.enterContentName(contentName);
+  await umbracoUi.content.clickSaveButton();
+
+  // Assert
+  await umbracoUi.content.isSuccessNotificationVisible();
+  expect(await umbracoApi.document.doesNameExist(contentName)).toBeTruthy();
+  const contentData = await umbracoApi.document.getByName(contentName);
+  expect(contentData.variants[0].state).toBe(expectedState);
+  expect(contentData.values).toEqual([]);
+});
+
+test('can publish content with the textarea data type', async ({umbracoApi, umbracoUi}) => {
+  // Arrange
+  const expectedState = 'Published';
+  const dataTypeData = await umbracoApi.dataType.getByName(dataTypeName);
+  const documentTypeId = await umbracoApi.documentType.createDocumentTypeWithPropertyEditor(documentTypeName, dataTypeName, dataTypeData.id);
+  await umbracoApi.document.createDefaultDocument(contentName, documentTypeId);
+  await umbracoUi.content.goToSection(ConstantHelper.sections.content);
+
+  // Act
+  await umbracoUi.content.goToContentWithName(contentName);
+  await umbracoUi.content.clickSaveAndPublishButton();
+
+  // Assert
+  await umbracoUi.content.doesSuccessNotificationsHaveCount(2);
+  expect(await umbracoApi.document.doesNameExist(contentName)).toBeTruthy();
+  const contentData = await umbracoApi.document.getByName(contentName);
+  expect(contentData.variants[0].state).toBe(expectedState);
+  expect(contentData.values).toEqual([]);
+});
+
+test('can input text into the textarea', async ({umbracoApi, umbracoUi}) => {
+  // Arrange
+  const dataTypeData = await umbracoApi.dataType.getByName(dataTypeName);
+  const documentTypeId = await umbracoApi.documentType.createDocumentTypeWithPropertyEditor(documentTypeName, dataTypeName, dataTypeData.id);
+  await umbracoApi.document.createDefaultDocument(contentName, documentTypeId);
+  await umbracoUi.content.goToSection(ConstantHelper.sections.content);
+
+  // Act
+  await umbracoUi.content.goToContentWithName(contentName);
+  await umbracoUi.content.enterTextArea(text);
+  await umbracoUi.content.clickSaveButton();
+
+  // Assert
+  await umbracoUi.content.isSuccessNotificationVisible();
+  expect(await umbracoApi.document.doesNameExist(contentName)).toBeTruthy();
+  const contentData = await umbracoApi.document.getByName(contentName);
+  expect(contentData.values[0].alias).toEqual(AliasHelper.toAlias(dataTypeName));
+  expect(contentData.values[0].value).toEqual(text);
+});
+
+test('cannot input the text that exceeds the allowed amount of characters', async ({umbracoApi, umbracoUi}) => {
+  // Arrange
+  const maxChars = 100;
+  const textExceedMaxChars = 'Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam mattis porttitor orci id cursus. Nulla';
+  const warningMessage = 'This field exceeds the allowed amount of characters';
+  const dataTypeId = await umbracoApi.dataType.createTextareaDataType(customDataTypeName, maxChars);
+  const documentTypeId = await umbracoApi.documentType.createDocumentTypeWithPropertyEditor(documentTypeName, customDataTypeName, dataTypeId);
+  await umbracoApi.document.createDefaultDocument(contentName, documentTypeId);
+  await umbracoUi.content.goToSection(ConstantHelper.sections.content);
+
+  // Act
+  await umbracoUi.content.goToContentWithName(contentName);
+  await umbracoUi.content.enterTextArea(textExceedMaxChars);
+  await umbracoUi.content.clickSaveButton();
+
+  // Assert
+  await umbracoUi.content.isTextWithExactNameVisible(warningMessage);
+  await umbracoUi.content.isSuccessNotificationVisible();
+
+  // Clean
+  await umbracoApi.dataType.ensureNameNotExists(customDataTypeName);
+});

tests/Umbraco.Tests.AcceptanceTest/tests/DefaultConfig/Content/ContentWithTextstring.spec.ts

@@ -0,0 +1,104 @@
+import {ConstantHelper, test, AliasHelper} from '@umbraco/playwright-testhelpers';
+import {expect} from "@playwright/test";
+
+const contentName = 'TestContent';
+const documentTypeName = 'TestDocumentTypeForContent';
+const dataTypeName = 'Textstring';
+const text = 'This is the content with textstring';
+const customDataTypeName = 'Custom Textstring';
+
+test.beforeEach(async ({umbracoApi, umbracoUi}) => {
+  await umbracoApi.documentType.ensureNameNotExists(documentTypeName);
+  await umbracoApi.document.ensureNameNotExists(contentName);
+  await umbracoUi.goToBackOffice();
+});
+
+test.afterEach(async ({umbracoApi}) => {
+  await umbracoApi.document.ensureNameNotExists(contentName); 
+  await umbracoApi.documentType.ensureNameNotExists(documentTypeName);
+});
+
+test('can create content with the textstring data type', async ({umbracoApi, umbracoUi}) => {
+  // Arrange
+  const expectedState = 'Draft';
+  const dataTypeData = await umbracoApi.dataType.getByName(dataTypeName);
+  await umbracoApi.documentType.createDocumentTypeWithPropertyEditor(documentTypeName, dataTypeName, dataTypeData.id);
+  await umbracoUi.content.goToSection(ConstantHelper.sections.content);
+
+  // Act
+  await umbracoUi.content.clickActionsMenuAtRoot();
+  await umbracoUi.content.clickCreateButton();
+  await umbracoUi.content.chooseDocumentType(documentTypeName);
+  await umbracoUi.content.enterContentName(contentName);
+  await umbracoUi.content.clickSaveButton();
+
+  // Assert
+  await umbracoUi.content.isSuccessNotificationVisible();
+  expect(await umbracoApi.document.doesNameExist(contentName)).toBeTruthy();
+  const contentData = await umbracoApi.document.getByName(contentName);
+  expect(contentData.variants[0].state).toBe(expectedState);
+  expect(contentData.values).toEqual([]);
+});
+
+test('can publish content with the textstring data type', async ({umbracoApi, umbracoUi}) => {
+  // Arrange
+  const expectedState = 'Published';
+  const dataTypeData = await umbracoApi.dataType.getByName(dataTypeName);
+  const documentTypeId = await umbracoApi.documentType.createDocumentTypeWithPropertyEditor(documentTypeName, dataTypeName, dataTypeData.id);
+  await umbracoApi.document.createDefaultDocument(contentName, documentTypeId);
+  await umbracoUi.content.goToSection(ConstantHelper.sections.content);
+
+  // Act
+  await umbracoUi.content.goToContentWithName(contentName);
+  await umbracoUi.content.clickSaveAndPublishButton();
+
+  // Assert
+  await umbracoUi.content.doesSuccessNotificationsHaveCount(2);
+  expect(await umbracoApi.document.doesNameExist(contentName)).toBeTruthy();
+  const contentData = await umbracoApi.document.getByName(contentName);
+  expect(contentData.variants[0].state).toBe(expectedState);
+  expect(contentData.values).toEqual([]);
+});
+
+test('can input text into the textstring', async ({umbracoApi, umbracoUi}) => {
+  // Arrange
+  const dataTypeData = await umbracoApi.dataType.getByName(dataTypeName);
+  const documentTypeId = await umbracoApi.documentType.createDocumentTypeWithPropertyEditor(documentTypeName, dataTypeName, dataTypeData.id);
+  await umbracoApi.document.createDefaultDocument(contentName, documentTypeId);
+  await umbracoUi.content.goToSection(ConstantHelper.sections.content);
+
+  // Act
+  await umbracoUi.content.goToContentWithName(contentName);
+  await umbracoUi.content.enterTextstring(text);
+  await umbracoUi.content.clickSaveButton();
+
+  // Assert
+  await umbracoUi.content.isSuccessNotificationVisible();
+  expect(await umbracoApi.document.doesNameExist(contentName)).toBeTruthy();
+  const contentData = await umbracoApi.document.getByName(contentName);
+  expect(contentData.values[0].alias).toEqual(AliasHelper.toAlias(dataTypeName));
+  expect(contentData.values[0].value).toEqual(text);
+});
+
+test('cannot input the text that exceeds the allowed amount of characters', async ({umbracoApi, umbracoUi}) => {
+  // Arrange
+  const maxChars = 20;
+  const textExceedMaxChars = 'Lorem ipsum dolor sit';
+  const warningMessage = 'This field exceeds the allowed amount of characters';
+  const dataTypeId = await umbracoApi.dataType.createTextstringDataType(customDataTypeName, maxChars);
+  const documentTypeId = await umbracoApi.documentType.createDocumentTypeWithPropertyEditor(documentTypeName, customDataTypeName, dataTypeId);
+  await umbracoApi.document.createDefaultDocument(contentName, documentTypeId);
+  await umbracoUi.content.goToSection(ConstantHelper.sections.content);
+
+  // Act
+  await umbracoUi.content.goToContentWithName(contentName);
+  await umbracoUi.content.enterTextstring(textExceedMaxChars);
+  await umbracoUi.content.clickSaveButton();
+
+  // Assert
+  await umbracoUi.content.isTextWithExactNameVisible(warningMessage);
+  await umbracoUi.content.isSuccessNotificationVisible();
+
+  // Clean
+  await umbracoApi.dataType.ensureNameNotExists(customDataTypeName);
+});

tests/Umbraco.Tests.AcceptanceTest/tests/DefaultConfig/Content/ContentWithTrueFalse.spec.ts

@@ -0,0 +1,142 @@
+import {ConstantHelper, test, AliasHelper} from '@umbraco/playwright-testhelpers';
+import {expect} from "@playwright/test";
+
+const contentName = 'TestContent';
+const documentTypeName = 'TestDocumentTypeForContent';
+const dataTypeName = 'True/false';
+const customDataTypeName = 'Custom Truefalse';
+
+test.beforeEach(async ({umbracoApi}) => {
+  await umbracoApi.documentType.ensureNameNotExists(documentTypeName);
+  await umbracoApi.document.ensureNameNotExists(contentName);
+});
+
+test.afterEach(async ({umbracoApi}) => {
+  await umbracoApi.document.ensureNameNotExists(contentName); 
+  await umbracoApi.documentType.ensureNameNotExists(documentTypeName);
+});
+
+test('can create content with the true/false data type', async ({umbracoApi, umbracoUi}) => {
+  // Arrange
+  const expectedState = 'Draft'; 
+  const dataTypeData = await umbracoApi.dataType.getByName(dataTypeName);
+  await umbracoApi.documentType.createDocumentTypeWithPropertyEditor(documentTypeName, dataTypeName, dataTypeData.id);
+  await umbracoUi.goToBackOffice();
+  await umbracoUi.content.goToSection(ConstantHelper.sections.content);
+
+  // Act
+  await umbracoUi.content.clickActionsMenuAtRoot();
+  await umbracoUi.content.clickCreateButton();
+  await umbracoUi.content.chooseDocumentType(documentTypeName);
+  await umbracoUi.content.enterContentName(contentName);
+  await umbracoUi.content.clickSaveButton();
+
+  // Assert
+  await umbracoUi.content.isSuccessNotificationVisible();
+  expect(await umbracoApi.document.doesNameExist(contentName)).toBeTruthy();
+  const contentData = await umbracoApi.document.getByName(contentName);
+  expect(contentData.variants[0].state).toBe(expectedState);
+  expect(contentData.values).toEqual([]);
+});
+
+test('can publish content with the true/false data type', async ({umbracoApi, umbracoUi}) => {
+  // Arrange
+  const expectedState = 'Published';
+  const dataTypeData = await umbracoApi.dataType.getByName(dataTypeName);
+  const documentTypeId = await umbracoApi.documentType.createDocumentTypeWithPropertyEditor(documentTypeName, dataTypeName, dataTypeData.id);
+  await umbracoApi.document.createDefaultDocument(contentName, documentTypeId);
+  await umbracoUi.goToBackOffice();
+  await umbracoUi.content.goToSection(ConstantHelper.sections.content);
+
+  // Act
+  await umbracoUi.content.goToContentWithName(contentName);
+  await umbracoUi.content.clickSaveAndPublishButton();
+
+  // Assert
+  await umbracoUi.content.doesSuccessNotificationsHaveCount(2);
+  expect(await umbracoApi.document.doesNameExist(contentName)).toBeTruthy();
+  const contentData = await umbracoApi.document.getByName(contentName);
+  expect(contentData.variants[0].state).toBe(expectedState);
+  expect(contentData.values).toEqual([]);
+});
+
+test('can toggle the true/false value in the content ', async ({umbracoApi, umbracoUi}) => {
+  // Arrange
+  const dataTypeData = await umbracoApi.dataType.getByName(dataTypeName);
+  const documentTypeId = await umbracoApi.documentType.createDocumentTypeWithPropertyEditor(documentTypeName, dataTypeName, dataTypeData.id);
+  await umbracoApi.document.createDefaultDocument(contentName, documentTypeId);
+  await umbracoUi.goToBackOffice();
+  await umbracoUi.content.goToSection(ConstantHelper.sections.content);
+
+  // Act
+  await umbracoUi.content.goToContentWithName(contentName);
+  await umbracoUi.content.clickToggleButton();
+  await umbracoUi.content.clickSaveButton();
+
+  // Assert
+  await umbracoUi.content.isSuccessNotificationVisible();
+  expect(await umbracoApi.document.doesNameExist(contentName)).toBeTruthy();
+  const contentData = await umbracoApi.document.getByName(contentName);
+  expect(contentData.values[0].alias).toEqual('truefalse');
+  expect(contentData.values[0].value).toEqual(true);
+});
+
+test('can toggle the true/false value with the initial state enabled', async ({umbracoApi, umbracoUi}) => {
+  // Arrange
+  const dataTypeId = await umbracoApi.dataType.createTrueFalseDataTypeWithInitialState(customDataTypeName);
+  const documentTypeId = await umbracoApi.documentType.createDocumentTypeWithPropertyEditor(documentTypeName, customDataTypeName, dataTypeId);
+  await umbracoApi.document.createDefaultDocument(contentName, documentTypeId);
+  await umbracoUi.goToBackOffice();
+  await umbracoUi.content.goToSection(ConstantHelper.sections.content);
+
+  // Act
+  await umbracoUi.content.goToContentWithName(contentName);
+  await umbracoUi.content.clickToggleButton();
+  await umbracoUi.content.clickSaveButton();
+
+  // Assert
+  await umbracoUi.content.isSuccessNotificationVisible();
+  expect(await umbracoApi.document.doesNameExist(contentName)).toBeTruthy();
+  const contentData = await umbracoApi.document.getByName(contentName);
+  expect(contentData.values[0].alias).toEqual(AliasHelper.toAlias(customDataTypeName));
+  expect(contentData.values[0].value).toEqual(false);
+});
+
+test('can show the label on for the true/false in the content ', async ({umbracoApi, umbracoUi}) => {
+  // Arrange
+  const labelOn = 'Test Label On';
+  const dataTypeId = await umbracoApi.dataType.createTrueFalseDataTypeWithLabelOn(customDataTypeName, labelOn);
+  const documentTypeId = await umbracoApi.documentType.createDocumentTypeWithPropertyEditor(documentTypeName, customDataTypeName, dataTypeId);
+  await umbracoApi.document.createDefaultDocument(contentName, documentTypeId);
+  await umbracoUi.goToBackOffice();
+  await umbracoUi.content.goToSection(ConstantHelper.sections.content);
+
+  // Act
+  await umbracoUi.content.goToContentWithName(contentName);
+  await umbracoUi.content.clickToggleButton();
+
+  // Assert
+  await umbracoUi.content.doesToggleHaveLabel(labelOn);
+
+  // Clean
+  await umbracoApi.dataType.ensureNameNotExists(customDataTypeName);
+});
+
+test('can show the label off for the true/false in the content ', async ({umbracoApi, umbracoUi}) => {
+  // Arrange
+  const labelOff = 'Test Label Off';
+  const dataTypeId = await umbracoApi.dataType.createTrueFalseDataTypeWithLabelOff(customDataTypeName, labelOff);
+  const documentTypeId = await umbracoApi.documentType.createDocumentTypeWithPropertyEditor(documentTypeName, customDataTypeName, dataTypeId);
+  await umbracoApi.document.createDefaultDocument(contentName, documentTypeId);
+  await umbracoUi.goToBackOffice();
+  await umbracoUi.content.goToSection(ConstantHelper.sections.content);
+
+  // Act
+  await umbracoUi.content.goToContentWithName(contentName);
+
+  // Assert
+  await umbracoUi.content.doesToggleHaveLabel(labelOff);
+
+  // Clean
+  await umbracoApi.dataType.ensureNameNotExists(customDataTypeName);
+});