Wait for fonts before goTo() and render() resolve

Since fonts are downloaded asynchronously, we should await the `document.fonts.ready` promise since further network requests may not be available once the page has loads

Similarly, some components are made visible after initialising JavaScript (or new elements created and inserted) so we should wait for additional font downloads to complete there too

E.g. GDS Transport Light may have loaded already, but GDS Transport Bold may be requested on demand as required

shared/helpers/puppeteer.js

@@ -158,6 +158,8 @@ async function render(page, componentName, renderOptions, browserOptions) {
         { cause: error }
       )
     }
+
+    await page.evaluateHandle('document.fonts.ready')
   } finally {
     // Disable middleware
     page.off('request', requestHandler)
@@ -219,6 +221,7 @@ async function goTo(page, path, options) {
     throw new Error(`HTTP ${code} for '${pathname}'`)
   }
 
+  await page.evaluateHandle('document.fonts.ready')
   await page.bringToFront()
 
   return page