alphagov / govuk-design-system

One place for service teams to find styles, components and patterns for designing government services.
https://www.gov.uk/design-system
MIT License
488 stars 230 forks source link

Broken in-page anchor in header compent #836

Closed edwardhorsford closed 5 years ago

edwardhorsford commented 5 years ago

I tried to fix this myself, but I can't for the life of me work out how this content works!

The third section header with service name and navigation has a broken anchor link inside the Nunjucks macro options guidance.

The guidance for navigation links to: https://design-system.service.gov.uk/components/header/#options-header-with-navigation-example--navigation

whereas the id of the table I think it's meant to go to is: https://design-system.service.gov.uk/components/header/#options-header-with-navigation-example--navigation

dashouse commented 5 years ago

Thanks for raising, from a quick review it looks like the URL is correct (I don't think there's a difference between the two links) but there's something else going on.

It looks to me like there is generally an issue with anchor links inside the Nunjucks option table.

For example, if you open the Nunjucks options table, click the "cross site scripting" link, go to MDN, press back (now page has Nunjucks options already open) and click the anchor link it works.

So something is blocking anchor links on the same page on first interaction. I'll discuss with the team and see if we want to re-purpose this issue or create a new one.

hannalaakso commented 5 years ago

So this happens because service name template and service name with navigation template use the same title in frontendmatter and this is then used to generate the anchor link.

We can fix the immediate problem by renaming title in one of them.

I've raised an issue to fix the larger problem here: https://github.com/alphagov/govuk-design-system/issues/848