Component test files use examples

[vanitabarrett]

Resolves #1894

What

• Updates component tests to consistently use the examples in the YAML files, and adds any tests for untested params
• Adds a flag to hide examples that we don't want shown in the GOVUK Frontend review app
• Adds a html param and example to the fieldset component as an alternative to caller

Why

Prep work for #1895

Note: I've left any examples that were previously visible in the review app as-is for now as I'm not sure what the reasoning was behind adding those particular examples as something to check. It's possible some of those examples could also be hidden with the new flag.

[hannalaakso]

Looking really great so far, I've now reviewed the following:

• warning text
• textarea
• tag
• tabs
• table
• summary list
• skip link
• select
• radios

[hannalaakso]

Looks good 👍 Reviewed

• phase banner
• panel
• label
• inset text
• input

Meant to just comment for now!

[hannalaakso]

Now that I've been working on adding the new prefix/suffix examples it strikes me that having the hidden examples at the end of the file makes it harder to scan the file to understand what examples already exist and having to move between the "visible" and "hidden" examples for the same thing which is kind of annoying.

This might just be me - but would be interesting to hear if either of you have any thoughts on how we organise the new examples in the file.

[vanitabarrett]

I chose to separate them out as when they were all together I found it difficult to quickly see which examples were shown in the review app and which weren't. But perhaps you'd only really need to do that when working on the fixtures, and most people would benefit from having all examples together?

[hannalaakso]

It would make sense to me to group the examples for the same thing together 👍 If they're being added to the end of the file with no groupings it might become difficult to find anything there and if you're a contributor who's looking to potentially add a new example it would be helpful to see what already exists for that variant.

[hannalaakso]

I do get that you'd need to move things in several files to do that @vanitabarrett. I don't know if @36degrees has any thoughts before you do that?

[36degrees]

I suspect no matter our intentions they're going to get muddled up over time anyway 😬 Which might be an argument for not keeping them together, unless we think we can enforce that separation going forward? Do you think there's a logical way to order / group the examples?

[hannalaakso]

I would have said the order in which they first appear in the test file, this seems to roughly follow the order of

default
with text
with html
with classes
with attributes

which would hopefully make the yaml easier to follow.

But I get your point that since we won't be programmatically enforcing it why even try to stick to a particular order.

[36degrees]

Happy that any issues I flagged previously on the components that I reviewed have been addressed – and that this can be merged once @hannalaakso has approved.

[hannalaakso]

Looks great to me too 👍