fix(ui5-multiinput): restore and adjust unit tests (#8933)

fix(ui5-multiinput): restore deleted tests

packages/main/test/pages/MultiInput.html

@@ -424,6 +424,14 @@ <h1 class="sample-container-title">Eventing</h1>
 			document.getElementById("dialog").open = true;
 		});
 
+		document.getElementById("suggestion-token").addEventListener("ui5-change", function (event) {
+			var text = event.target.value;
+
+			addTokenToMI(createTokenFromText(text), "suggestion-token");
+
+			event.target.value = "";
+		});
+
 		document.getElementById("basic-overflow-and-icon").addEventListener("ui5-value-help-trigger", function (event) {
 			document.getElementById("basic-event-listener").innerHTML = "value help icon press";
 		});

packages/main/test/specs/MultiInput.spec.js

@@ -122,6 +122,27 @@ describe("MultiInput general interaction", () => {
 		assert.ok(await allTokens[5].getProperty("overflows"), `Token 5 should not overflow`);
 	});
 
+	it("Should create a token on change event", async () => {
+		await browser.url(`test/pages/MultiInput.html`);
+
+		const mi = await browser.$("#suggestion-token");
+		const input = await mi.shadow$("input");
+		const popover = await mi.shadow$("ui5-responsive-popover");
+
+		await input.click();
+		await input.keys("c");
+
+		assert.ok(await popover.getProperty("open"), "Suggestion popover is open");
+		let allTokens = await mi.$$("ui5-token");
+		assert.strictEqual(allTokens.length, 0, "0 tokens");
+
+		await popover.$("ui5-li-suggestion-item").click();
+
+		allTokens = await mi.$$("ui5-token");
+		assert.notOk(await popover.getProperty("open"), "Suggestion popover is closed");
+		assert.strictEqual(allTokens.length, 1, "a token is added after change");
+	});
+
 	it ("Placeholder", async () => {
 		const mi1 = await browser.$("#empty-mi").shadow$(".ui5-input-inner");
 		const mi2 = await browser.$("#mi-with-tokens-customicon").shadow$(".ui5-input-inner");
@@ -507,6 +528,28 @@ describe("Keyboard handling", () => {
 		assert.notOk(await input.getProperty("focused"), "The input loses focus on Backspace");
 	});
 
+	it("should change input's value when set in selection change event", async () => {
+		await browser.url(`test/pages/MultiInput.html`);
+		const input = $("#suggestion-token");
+		const innerInput = input.shadow$("input");
+
+		await input.scrollIntoView();
+		await innerInput.click();
+		await innerInput.keys('a');
+		await innerInput.keys("Enter");
+
+		assert.strictEqual(await input.getProperty("value"), "", "value should be cleared in event handler");
+		assert.strictEqual(await innerInput.getProperty("value"), "", "inner value should be cleared in event handler");
+
+		await innerInput.keys("ArrowLeft");
+
+		assert.isNotOk(await input.getProperty("focused"), "focused property has been removed from input");
+
+		await innerInput.keys("ArrowRight");
+
+		assert.isOk(await input.getProperty("focused"), "focused property has been set to the input");
+	});
+
 	it("should text field always when focus in" , async () => {
 		const mi = $("#one-token");
 		const inner = mi.shadow$("input");