@ui5/webcomponents-base 2.11.0-rc.1 → 2.11.0-rc.3

package/cypress/specs/UI5ElementSlots.cy.tsx

@@ -1,136 +0,0 @@
-import Generic from "../../test/test-elements/Generic.js";
-
-describe("Slots work properly", () => {
-	it("Tests that properties exist on the element for each slot", () => {
-		cy.mount(
-			<Generic>
-				Default slot text
-				<span>Default slot content</span>
-				<span slot="other">Other slot content 1</span>
-				<span slot="other">Other slot content 2</span>
-				<span slot="individual">Individual slot content 1</span>
-				<span slot="individual">Individual slot content 2</span>
-				<span slot="named">Item in slot with propertyName</span>
-				<span slot="named">Item in slot with propertyName</span>
-				<span slot="row-header">Item in slot row-header</span>
-				<span slot="row-header">Item in slot row-header</span>
-			</Generic>
-		);
-
-		cy.get<Generic>("[ui5-test-generic]")
-			.should($el => {
-				expect($el[0].getDomRef()).to.exist;
-			});
-
-		cy.get("[ui5-test-generic]")
-			.as("testGeneric");
-
-		cy.get("@testGeneric")
-			.invoke("prop", "content")
-			.then(value => {
-				return (value as Array<unknown>).length;
-			})
-			.should("be.greaterThan", 0);
-
-		cy.get("@testGeneric")
-			.invoke("prop", "other")
-			.should("have.length", 2);
-
-		cy.get("@testGeneric")
-			.invoke("prop", "individual")
-			.should("have.length", 2);
-
-		cy.get("@testGeneric")
-			.invoke("prop", "row-header")
-			.should("have.length", 2);
-
-		cy.get("@testGeneric")
-			.invoke("prop", "named")
-			.should("be.undefined");
-	});
-
-	it("Tests that properties exist on the element for each slot", () => {
-		cy.mount(
-			<Generic>
-				<span slot="individual">Individual slot content 1</span>
-				<span slot="individual">Individual slot content 2</span>
-			</Generic>
-		);
-
-		cy.get<Generic>("[ui5-test-generic]")
-			.should($el => {
-				expect($el[0].getDomRef()).to.exist;
-			});
-
-		cy.get("[ui5-test-generic]");
-
-		cy.get("[slot=individual]")
-			.should("not.exist");
-
-		cy.get("[slot=individual-1]")
-			.should("exist");
-
-		cy.get("[slot=individual-2]")
-			.should("exist");
-	});
-
-	it("Tests that changing the slot attribute of children redistributes them across slot accessors", () => {
-		let defaultSlotLength = 0;
-
-		cy.mount(
-			<Generic>
-				<span>Default slot content</span>
-				<span slot="other" id="o1">Other slot content 1</span>
-				<span slot="other" id="o2">Other slot content 2</span>
-				<span slot="named">Item in slot with propertyName</span>
-				<span slot="named">Item in slot with propertyName</span>
-			</Generic>
-		);
-
-		cy.get<Generic>("[ui5-test-generic]")
-			.should($el => {
-				expect($el[0].getDomRef()).to.exist;
-			});
-
-		cy.get("[ui5-test-generic]")
-			.as("testGeneric");
-
-		cy.get("@testGeneric")
-			.invoke("prop", "content")
-			.then(value => {
-				defaultSlotLength = value.length;
-
-				return defaultSlotLength;
-			})
-			.should("be.greaterThan", 0);
-
-		cy.get("@testGeneric")
-			.invoke("prop", "other")
-			.should("have.length", 2);
-
-		cy.get("@testGeneric")
-			.invoke("prop", "items")
-			.should("have.length", 2);
-
-		cy.get("#o1")
-			.invoke("removeAttr", "slot");
-
-		cy.get("#o2")
-			.invoke("attr", "slot", "named");
-
-		cy.get("@testGeneric")
-			.then($testGeneric => {
-				cy.wrap($testGeneric)
-					.invoke("prop", "content")
-					.should("have.length", defaultSlotLength + 1);
-			});
-
-		cy.get("@testGeneric")
-			.invoke("prop", "other")
-			.should("have.length", 0);
-
-		cy.get("@testGeneric")
-			.invoke("prop", "items")
-			.should("have.length", 3);
-	});
-});

package/cypress/specs/WithComplexTemplate.cy.tsx

@@ -1,32 +0,0 @@
-import WithComplexTemplate from "../../test/test-elements/WithComplexTemplate.js";
-
-describe("Complex templates", () => {
-	it("Tests context maintained in the HBS template before, after and inside 'each' statements", () => {
-		const EXPTECTED_LOOP_CONTENT = "Root text: root, Item text: positives";
-		const EXPTECTED_NESTED_LOOP_CONTENT = "Root Text: root, Word text: word1_good";
-
-		cy.mount(<WithComplexTemplate />);
-
-		cy.get("[ui5-test-complex-template]")
-			.shadow()
-			.find(".before-each-content--start--0")
-			.should("have.text", EXPTECTED_LOOP_CONTENT);
-
-		cy.get("[ui5-test-complex-template]")
-			.shadow()
-			.find(".nested-each-content--0--0")
-			.first()
-			.should("have.text", EXPTECTED_NESTED_LOOP_CONTENT);
-
-		cy.get("[ui5-test-complex-template]")
-			.shadow()
-			.find(".nested-each-content--0--1")
-			.first()
-			.should("have.text", EXPTECTED_NESTED_LOOP_CONTENT);
-
-		cy.get("[ui5-test-complex-template]")
-			.shadow()
-			.find(".after-each-content--end--0")
-			.should("have.text", EXPTECTED_LOOP_CONTENT);
-	});
-});

package/cypress/specs/i18n_texts.cy.tsx

@@ -1,129 +0,0 @@
-import { setLanguage } from "../../src/config/Language.js";
-import { registerI18nLoader, getI18nBundle } from "../../src/i18nBundle.js";
-import parseProperties from "../../src/PropertiesFileFormat.js";
-import I18nParent from "../../test/test-elements/I18nParent.js";
-import I18nChild from "../../test/test-elements/I18nChild.js";
-import I18nChild2 from "../../test/test-elements/I18nChild2.js";
-
-const props = `PLEASE_WAIT=Patientez.
-TEST_1=Text '{0}
-TEST_2=Text ''{0}
-TEST_3=Text ''{0}''
-TEST_4=Text
-TEST_5=Text '
-TEST_6=Text ''
-TEST_7=Text {0}
-TEST_8=Text '{0}'
-TEST_9=Text '{0}''`;
-
-const texts = [
-	{ key: "TEST_1", result: "Text {0}" },
-	{ key: "TEST_2", result: "Text 'test" },
-	{ key: "TEST_3", result: "Text 'test'" },
-	{ key: "TEST_4", result: "Text" },
-	{ key: "TEST_5", result: "Text '" },
-	{ key: "TEST_6", result: "Text '" },
-	{ key: "TEST_7", result: "Text test" },
-	{ key: "TEST_8", result: "Text {0}" },
-	{ key: "TEST_9", result: "Text {0}'" }
-];
-
-describe("i18n texts", () => {
-	beforeEach(() => {
-		cy.wrap({ setLanguage, registerI18nLoader, getI18nBundle })
-			.then(async api => {
-				// eslint-disable-next-line @typescript-eslint/require-await
-				api.registerI18nLoader("myApp", "fr", async () => {
-					return parseProperties(props);
-				});
-
-				await api.setLanguage("fr");
-			});
-	});
-
-	it("Getting text from current language", () => {
-		cy.wrap({ getI18nBundle })
-			.then(async api => {
-				const bundle = await api.getI18nBundle("myApp");
-
-				return bundle.getText("PLEASE_WAIT");
-			})
-			.should("equal", "Patientez.");
-
-		cy.wrap({ setLanguage })
-			.then(async api => {
-				await api.setLanguage("bg");
-			});
-
-		cy.wrap({ getI18nBundle })
-			.then(async api => {
-				const bundle = await api.getI18nBundle("myApp");
-
-				return bundle.getText("PLEASE_WAIT");
-			})
-			.should("equal", "PLEASE_WAIT");
-	});
-
-	// Single quote ' escape some symbols after it. For example: "Text '{0}" will result in "Text {0}". To use single
-	// quote you have to use: ''
-	it("Single quote '", () => {
-		texts.forEach(textData => {
-			cy.wrap({ getI18nBundle })
-				.then(async api => {
-					const bundle = await api.getI18nBundle("myApp");
-
-					return bundle.getText(textData.key, "test");
-				})
-				.should("equal", textData.result);
-		});
-	});
-});
-
-describe("i18n decorator", () => {
-	beforeEach(() => {
-		cy.wrap({ setLanguage, registerI18nLoader })
-			.then(async api => {
-				// eslint-disable-next-line @typescript-eslint/require-await
-				api.registerI18nLoader("custom-language", "bg", async () => {
-					return parseProperties(`PLEASE_WAIT=Моля изчакайте`);
-				});
-
-				// eslint-disable-next-line @typescript-eslint/require-await
-				api.registerI18nLoader("another-custom-language", "bg", async () => {
-					return parseProperties(`SOME_KEY=Някакъв ключ`);
-				});
-
-				await api.setLanguage("bg");
-			});
-	});
-
-	it("Bundle is accessed from every class", () => {
-		cy.mount(<>
-			<I18nParent />
-			<I18nChild />
-		</>);
-
-		cy.get("[i18n-parent]")
-			.invoke("prop", "i18nText")
-			.should("be.equal", "Моля изчакайте");
-
-		cy.get("[i18n-child]")
-			.invoke("prop", "i18nText")
-			.should("be.equal", "Моля изчакайте");
-	});
-
-	it("Bundle storage works correctly", () => {
-		cy.mount(<>
-			<I18nParent />
-			<I18nChild2 />
-		</>);
-
-		cy.get("[i18n-parent]")
-			.invoke("prop", "i18nText")
-			.should("be.equal", "Моля изчакайте");
-
-		cy.get("[i18n-child2]")
-			.invoke("prop", "i18nText")
-			.should("be.equal", "Някакъв ключ");
-	});
-});

package/cypress/specs/util/FocusableElements.cy.tsx

@@ -1,48 +0,0 @@
-import { getFirstFocusableElement } from "@ui5/webcomponents-base/dist/util/FocusableElements.js";
-import SideNavigation from "@ui5/webcomponents-fiori/dist/SideNavigation.js";
-import SideNavigationItem from "@ui5/webcomponents-fiori/dist/SideNavigationItem.js";
-import SideNavigationSubItem from "@ui5/webcomponents-fiori/dist/SideNavigationSubItem.js";
-import Button from "@ui5/webcomponents/dist/Button.js";
-import Input from "@ui5/webcomponents/dist/Input.js";
-
-describe("FocusableElements", () => {
-	it("Tests first focusable element", () => {
-		cy.mount(
-			<>
-				<div id="container">
-					<Input tabindex="-1"></Input>
-					<br/>
-					<SideNavigation>
-						<SideNavigationItem
-							text="Home"
-							icon="home"
-							href="#home"
-							title="Home tooltip"></SideNavigationItem>
-						<SideNavigationItem text="People" href="#people" expanded icon="group">
-							<SideNavigationSubItem
-								id="subItem1"
-								selected
-								text="Should be Focused When Open"></SideNavigationSubItem>
-							<SideNavigationSubItem text="Sub Item 2"></SideNavigationSubItem>
-						</SideNavigationItem>
-					</SideNavigation>
-					<br/>
-					<Button id="buttonId">Close</Button>
-				</div>
-			</>
-		);
-
-		cy.get("#subItem1")
-			.shadow()
-			.find(".ui5-sn-item")
-			.should("have.attr", "tabindex", "0");
-
-		cy.get("#container").then( async ($container) => {
-		   const firstFocusable = await getFirstFocusableElement($container.get(0));
-		   await firstFocusable?.focus();
-		});
-
-		cy.get("#subItem1")
-			.should("have.focus");
-	});
-});

package/cypress/support/commands.ts

@@ -1,39 +0,0 @@
-/// <reference types="cypress" />
-// ***********************************************
-// This example commands.ts shows you how to
-// create various custom commands and overwrite
-// existing commands.
-//
-// For more comprehensive examples of custom
-// commands please read more here:
-// https://on.cypress.io/custom-commands
-// ***********************************************
-//
-//
-// -- This is a parent command --
-// Cypress.Commands.add('login', (email, password) => { ... })
-//
-//
-// -- This is a child command --
-// Cypress.Commands.add('drag', { prevSubject: 'element'}, (subject, options) => { ... })
-//
-//
-// -- This is a dual command --
-// Cypress.Commands.add('dismiss', { prevSubject: 'optional'}, (subject, options) => { ... })
-//
-//
-// -- This will overwrite an existing command --
-// Cypress.Commands.overwrite('visit', (originalFn, url, options) => { ... })
-//
-// declare global {
-//   namespace Cypress {
-//     interface Chainable {
-//       login(email: string, password: string): Chainable<void>
-//       drag(subject: string, options?: Partial<TypeOptions>): Chainable<Element>
-//       dismiss(subject: string, options?: Partial<TypeOptions>): Chainable<Element>
-//       visit(originalFn: CommandOriginalFn, url: string, options: Partial<VisitOptions>): Chainable<Element>
-//     }
-//   }
-// }
-
-import "@ui5/cypress-internal/commands.js";

package/cypress/support/component-index.html

@@ -1,12 +0,0 @@
-<!DOCTYPE html>
-<html>
-  <head>
-    <meta charset="utf-8">
-    <meta http-equiv="X-UA-Compatible" content="IE=edge">
-    <meta name="viewport" content="width=device-width,initial-scale=1.0">
-    <title>Components App</title>
-  </head>
-  <body>
-    <div data-cy-root></div>
-  </body>
-</html>

package/cypress/support/component.ts

@@ -1,17 +0,0 @@
-// ***********************************************************
-// This example support/component.ts is processed and
-// loaded automatically before your test files.
-//
-// This is a great place to put global configuration and
-// behavior that modifies Cypress.
-//
-// You can change the location of this file or turn off
-// automatically serving support files with the
-// 'supportFile' configuration option.
-//
-// You can read more here:
-// https://on.cypress.io/configuration
-// ***********************************************************
-
-// Import commands.js using ES2015 syntax:
-import './commands'

package/cypress/tsconfig.json

@@ -1,21 +0,0 @@
-{
-	"extends": "@ui5/webcomponents-tools/tsconfig.json",
-	"include": [
-		"./**/*"
-	],
-	"compilerOptions": {
-		"outDir": "dist",
-		"composite": true,
-		"tsBuildInfoFile": "dist/.tsbuildinfobuild",
-		"module": "NodeNext",
-		"moduleResolution": "nodenext",
-	},
-	"references": [
-		{
-			"path": "../"
-		},
-		{
-			"path": "../test/"
-		},
-	]
-}