chore: clean components & focus after tests

[ncoden]

Description

After tests are run, any HTML added must be removed as the DOM is shared with others tests. Otherwise, there can be side effects on others tests.

This is what happened with DropdownMenu, where one drodown that was not removed made an other tests failing by changing the way the browser should handle the focus.

• Closes [Dropdown] tests: activeElement is the body in IE11 #11074

Changes

• ensure html and components are cleared after DropdownMenu tests.
  They was not cleared as $html and plugin were re-defined in tests, overriding already created $html and plugin and making them not being cleared.
• removed toggler triggers after Toggler tests
• clear focus after all tests involving focus

Types of changes

• Documentation
• Bug fix (non-breaking change which fixes an issue)
• New feature (non-breaking change which adds functionality)
• Breaking change (fix or feature that would cause existing
  functionality to change)

Checklist (all required):

• I have read and follow the CONTRIBUTING document.
• There are no other pull request similar to this one.
• The pull request title is descriptive.
• The template is fully and correctly filled.
• The pull request targets the right branch (develop or support/*).
• My commits are correctly titled and contain all relevant information.
• My code follows the code style of this project.
• I have updated the documentation accordingly to my changes (if relevant).
• I have added tests to cover my changes (if relevant).
• All new and existing tests passed.

[DanielRuf]

where one drodown that was not removed made an other tests failing by changing the way the browser should handle the focus.

Thought https://github.com/ncoden/foundation-sites/blob/814d2e55f2313675c558d2d520b423bf02a79b4e/test/javascript/components/dropdownMenu.js#L45 already does this.

[ncoden]

Thought ncoden/foundation-sites:test/javascript/components/dropdownMenu.js@814d2e5#L45 already does this.

Updated my PR description:

Changes

• ensure html and components are cleared after DropdownMenu tests.
  They was not cleared as $html and plugin were re-defined in tests, overriding already created $html and plugin and making them not being cleared.
• removed toggler triggers after Toggler tests

[DanielRuf]

https://travis-ci.org/zurb/foundation-sites/jobs/372242588#L1284 and https://travis-ci.org/zurb/foundation-sites/jobs/372242588#L2478 and further.

[ncoden]

This does not fix it and produces new issues as far as I can see.

True. I don't know why I got this working when testing... I'll investigate further.

[ncoden]

According to me, the "works well alone but not after others tests" thing indicates that something is not cleared correctly, in tests or components.

[ncoden]

Edit: The bug seems to be caused by the test just above:

Dropdown: keyboard events Dropdown does not focus Dropdown when anchor is an input 

Without this test, everything works fine. With this test only, we get the focus bug.

[ncoden]

Focus caused by others tests was the problem. IE seems to not handle it correctly when an element is focused, then removed and an other element is focused, all of that synchronously.

If we add a timeout just before the second element is focused, or if we clear the focus before the first element is removed, the second element is focused correctly.

I really think this is a browser issue because the Foundation components involved in this issue (Dropdown and DropdownMenu) do not rely on the currently focused element (no :focus or activeElement used) and because no .focus() except the one we expect is called during the test.

Tests runs well now and I don't think there is anything we can change in the component itself.

@DanielRuf What do you think ?

[ncoden]

[Windows 7, Internet Explorer 9.0] Error: "does not find focusable elements with negative tabindex" failed, expected {} to equal 0
(...)
-- https://travis-ci.org/zurb/foundation-sites/jobs/372449224#L1236

This was not introduced by this PR. See tests for for develop: https://travis-ci.org/zurb/foundation-sites/jobs/372198260#L4883

[ncoden]

@DanielRuf

Do we not need the comment here?

See #11210 (comment). Do you want me to add these comments back ?

[DanielRuf]

See #11210 (comment). Do you want me to add these comments back ?

Probably as these describe what happens there.

[ncoden]

Probably as these describe what happens there.

9d39644 docs: add back comments in dropdownMenu tests