IE8 causes 404 errors when using Frontend 3.0

We recently upgraded our app to Frontend 3.0.

As a result we have noticed that we are getting lots of 404 errors in our server logs from IE8 users requesting invalid URLs e.g. https://gateway.prod.nomis-api.service.hmpps.dsd.io:443/auth/fonts/bold-b542beb274-v2.woff2)%20format(%22woff2%22),%20url(/auth/fonts/bold-affa96571d-v2.woff)%20format(%22woff%22

It looks like IE8 doesn’t understand the @font-face directive and treats format("woff2"),url( as part of the URL too.

As a side issue woff2 isn’t supported in IE8 so shouldn’t be included in the IE8 css (https://github.com/alphagov/govuk-frontend/blob/master/dist/govuk-frontend-ie8-3.1.0.min.css).

[hannalaakso]

Yeah I think anything like that would fall some way outside our support matrix

[hannalaakso]

I did some investigation. The font paths themselves could be naively fixed by adding ?#iefix to the end of the URLs which is what we used to do in v2. However this would just mean that the woff2 files get downloaded by IE8 which is redundant as IE8 doesn’t support the format.

We could put a govuk-if-ie8 check in font-faces which would stop them being outputted for IE8. This would mean that the font files aren’t downloaded by IE8 and we fall back to Arial. This could be an okay fix? However it would mean that CSS for IE8 would still say: font-family: "GDS Transport", Arial, sans-serif; which is somewhat confusing but then this is what v3 already does anyway.

Or we could define a font family for IE8.

$govuk-font-family-ie8-fallback-for-gds-transport: Arial, sans-serif;

(we don’t have access to govuk-if-ie8 mixin in /settings).

Thoughts? I’ll pick this up later.