chore(integration-tests): delegate-focus- -> delegates-focus-

Author: wjhsf

packages/@lwc/integration-tests/src/components/accessibility/delegates-focus-click-input-in-negative-tabindex-previous-sibling-focused/delegates-focus-click-input-in-negative-tabindex-previous-sibling-focused.spec.js

@@ -0,0 +1,33 @@
+/*
+ * Copyright (c) 2018, salesforce.com, inc.
+ * All rights reserved.
+ * SPDX-License-Identifier: MIT
+ * For full license text, see the LICENSE file in the repo root or https://opensource.org/licenses/MIT
+ */
+const assert = require('assert');
+
+// The bug: Cannot click into the first child of a shadow root when the active element is
+// the previous sibling to the custom element
+
+describe('Delegates focus', () => {
+    const URL = '/delegate-focus-click-input-in-negative-tabindex-previous-sibling-focused';
+
+    before(async () => {
+        await browser.url(URL);
+    });
+
+    it('should focus the input when clicked', async () => {
+        await browser.keys(['Tab']); // focus first anchor
+        await browser.keys(['Tab']); // focus second anchor
+        const input = await browser.shadowDeep$(
+            'integration-delegate-focus-click-input-in-negative-tabindex-previous-sibling-focused',
+            'integration-child',
+            'input'
+        );
+
+        await input.click();
+
+        const active = await browser.activeElementShadowDeep();
+        assert.strictEqual(await active.getTagName(), 'input');
+    });
+});

packages/@lwc/integration-tests/src/components/accessibility/delegates-focus-click-input-in-negative-tabindex-previous-sibling-focused/integration/child/child.html

@@ -0,0 +1,3 @@
+<template>
+    <input type="text" />
+</template>

packages/@lwc/integration-tests/src/components/accessibility/delegates-focus-click-input-in-negative-tabindex-previous-sibling-focused/integration/child/child.js

@@ -0,0 +1,5 @@
+import { LightningElement } from 'lwc';
+
+export default class Child extends LightningElement {
+    static delegatesFocus = true;
+}

packages/@lwc/integration-tests/src/components/accessibility/delegates-focus-click-input-in-negative-tabindex-previous-sibling-focused/integration/delegates-focus-click-input-in-negative-tabindex-previous-sibling-focused/delegates-focus-click-input-in-negative-tabindex-previous-sibling-focused.html

@@ -0,0 +1,6 @@
+<template>
+    <a href="#">Anchor 1</a>
+    <a href="#">Anchor 2</a>
+    <integration-child tabindex="-1"></integration-child>
+    <span tabindex="0">Focusable span</span>
+</template>

packages/@lwc/integration-tests/src/components/accessibility/delegates-focus-click-input-in-negative-tabindex-previous-sibling-focused/integration/delegates-focus-click-input-in-negative-tabindex-previous-sibling-focused/delegates-focus-click-input-in-negative-tabindex-previous-sibling-focused.js

@@ -0,0 +1,3 @@
+import { LightningElement } from 'lwc';
+
+export default class DelegatesFocus extends LightningElement {}

packages/@lwc/integration-tests/src/components/accessibility/delegates-focus-click-input-in-negative-tabindex/delegates-focus-click-input-in-negative-tabindex.spec.js

@@ -0,0 +1,28 @@
+/*
+ * Copyright (c) 2018, salesforce.com, inc.
+ * All rights reserved.
+ * SPDX-License-Identifier: MIT
+ * For full license text, see the LICENSE file in the repo root or https://opensource.org/licenses/MIT
+ */
+const assert = require('assert');
+describe('Delegates focus', () => {
+    const URL = '/delegate-focus-click-input-in-negative-tabindex';
+
+    before(async () => {
+        await browser.url(URL);
+    });
+
+    it('should focus the input when clicked', async () => {
+        await browser.keys(['Tab']); // focus first anchor
+        const input = await browser.shadowDeep$(
+            'integration-delegate-focus-click-input-in-negative-tabindex',
+            'integration-child',
+            'input'
+        );
+
+        await input.click(); // click into input
+
+        const active = await browser.activeElementShadowDeep();
+        assert.strictEqual(await active.getTagName(), 'input');
+    });
+});

packages/@lwc/integration-tests/src/components/accessibility/delegates-focus-click-input-in-negative-tabindex/integration/child/child.html

@@ -0,0 +1,3 @@
+<template>
+    <input type="text" />
+</template>

packages/@lwc/integration-tests/src/components/accessibility/delegates-focus-click-input-in-negative-tabindex/integration/child/child.js

@@ -0,0 +1,5 @@
+import { LightningElement } from 'lwc';
+
+export default class Child extends LightningElement {
+    static delegatesFocus = true;
+}

packages/@lwc/integration-tests/src/components/accessibility/delegates-focus-click-input-in-negative-tabindex/integration/delegates-focus-click-input-in-negative-tabindex/delegates-focus-click-input-in-negative-tabindex.html

@@ -0,0 +1,6 @@
+<template>
+    <a href="#">Anchor 1</a>
+    <a href="#">Anchor 2</a>
+    <integration-child tabindex="-1"></integration-child>
+    <span tabindex="0">Focusable span</span>
+</template>

packages/@lwc/integration-tests/src/components/accessibility/delegates-focus-click-input-in-negative-tabindex/integration/delegates-focus-click-input-in-negative-tabindex/delegates-focus-click-input-in-negative-tabindex.js

@@ -0,0 +1,3 @@
+import { LightningElement } from 'lwc';
+
+export default class DelegatesFocus extends LightningElement {}