Add tests for logger output when component attributes are overridden by slots

[luminousleek]

What is the purpose of this pull request?

• Documentation update
• Bug fix
• Feature addition or enhancement
• Code maintenance
• DevOps
• Improve developer experience
• Others, please explain: Testing

Fixes #2476

Overview of changes:

• Add tests for logger warning output when slots override attributes for box, modal, tooltip, tab and tab-group
• Add tests for processing of scroll-top-button and a-point
• Add test for logger warning output when content attribute overrides src attribute in popover
• Refactor some existing tests to test each overridden attribute individually instead of all of them together

Anything you'd like to highlight/discuss:

Inconsistent Test Inputs across Components

For some components, the test inputs test for all attributes at once to see if they are being checked properly, e.g.

export const PROCESS_PANEL_ATTRIBUTES = `
<panel header="# Lorem ipsum" alt="_emphasized alt_">
  Header and alt attributes should be processed and inserted under panel as slots and internal slots respectively and deleted.
</panel>
`;

export const PROCESS_PANEL_ATTRIBUTES_EXPECTED = `
<panel><template #header><h1>Lorem ipsum</h1>
</template><template #_alt><p><em>emphasized alt</em></p>
</template>
  Header and alt attributes should be processed and inserted under panel as slots and internal slots respectively and deleted.
</panel>
`;

where both the header and alt attributes are tested at the same time. However, for other components e.g. box, these are tested one at a time:

export const PROCESS_BOX_ICON = `
<box icon=":rocket:">
  Icon attribute should be inserted as icon slot and deleted.
</box>
`;

export const PROCESS_BOX_ICON_EXPECTED = `
<box><template #icon>🚀</template>
  Icon attribute should be inserted as icon slot and deleted.
</box>
`;

export const PROCESS_BOX_HEADER = `
<box header="#### Lorem ipsum dolor sit amet :rocket:">
  Header attribute should be inserted as header slot and deleted.
</box>
`;

export const PROCESS_BOX_HEADER_EXPECTED = `
<box><template #header><h4>Lorem ipsum dolor sit amet 🚀</h4>
</template>
  Header attribute should be inserted as header slot and deleted.
</box>
`;

Do let me know which one you prefer and I will refactor accordingly. Personally I don't see a real need to separate the attributes for the tests.

Other things

Documentation for which attributes are able to be overridden will be done in a separate PR.

Lastly, sorry for the long PR :(

Testing instructions:

Proposed commit message: (wrap lines at 72 characters)

Add tests for logger output when overriding attributes

Currently only certain components are tested for logger warnings
when their attributes are overridden by slots.

Let's add tests for the remaining attributes and components, as well
as add missing tests for the components which do not currently
have tests.

---

Checklist: ☑️

• Updated the documentation for feature additions and enhancements
• Added tests for bug fixes or features
• Linked all related issues
• No unrelated changes

---

Reviewer checklist:

Indicate the SEMVER impact of the PR:

• Major (when you make incompatible API changes)
• Minor (when you add functionality in a backward compatible manner)
• Patch (when you make backward compatible bug fixes)

At the end of the review, please label the PR with the appropriate label: r.Major, r.Minor, r.Patch.

Breaking change release note preparation (if applicable):

• To be included in the release note for any feature that is made obsolete/breaking

Give a brief explanation note about:

• what was the old feature that was made obsolete
• any replacement feature (if any), and
• how the author should modify his website to migrate from the old feature to the replacement feature (if possible).

[yucheng11122017]

LGTM! Thanks for the detailed work @luminousleek

[itsyme]

LGTM! Thanks adding more tests!