trying waitForFonts

UCLALibrary · Oct 17, 2024 · d98a19f · d98a19f
1 parent fed5ce2
commit d98a19f
Show file tree

Hide file tree

Showing 7 changed files with 13 additions and 17 deletions.
diff --git a/.storybook/preview.ts b/.storybook/preview.ts
@@ -1,3 +1,4 @@
+
 import { setup } from "@storybook/vue3"
 import type { Preview } from "@storybook/vue3"
 import "ucla-library-design-tokens/scss/app-global.scss"
@@ -60,9 +61,6 @@ export const parameters = {
         },
     },
 }
-
-export const decorators = [ (Story) => { document.fonts.ready.then(() => Story()); return <Story />; }, ];
-
 setup((app) => {
     app.use(router)
     app.use(createPinia())

diff --git a/cypress/support/commands.js b/cypress/support/commands.js
@@ -3,14 +3,13 @@
 Cypress.Commands.add('waitForFontsToLoad', () => {
   return cy.window().then((win) => {
     return new Promise((resolve) => {
-      if (win.document.fonts.status === 'loaded') {
-        resolve(); // Fonts are already loaded
-      } else {
-        win.document.fonts.ready.then(resolve); // Wait until fonts are ready
-      }
-    });
-  });
-});
+      if (win.document.fonts.status === 'loaded')
+        resolve() // Fonts are already loaded
+      else
+        win.document.fonts.ready.then(resolve) // Wait until fonts are ready
+    })
+  })
+})
 
 // ***********************************************
 // This example commands.ts shows you how to

diff --git a/src/stories/BannerFeatured.spec.js b/src/stories/BannerFeatured.spec.js
@@ -5,7 +5,7 @@ describe('BannerFeatured', () => {
     )
     cy.get('.banner-featured').should('exist')
 
-// Wait for fonts to load before proceeding
+    // Wait for fonts to load before proceeding
     cy.waitForFontsToLoad().then(() => {
       // Now take Percy snapshot
       cy.percySnapshot('Banner Featured: Defaul')

diff --git a/src/stories/BlockEventDetail.spec.js b/src/stories/BlockEventDetail.spec.js
@@ -5,7 +5,7 @@ describe('BlockEventDetail', () => {
     )
     cy.get('.block-event-detail').should('exist')
 
-// Wait for fonts to load before proceeding
+    // Wait for fonts to load before proceeding
     cy.waitForFontsToLoad().then(() => {
       // Now take Percy snapshot
       cy.percySnapshot('BLOCK / Event Detail: Default')

diff --git a/src/stories/ButtonShow.spec.js b/src/stories/ButtonShow.spec.js
@@ -3,8 +3,7 @@ describe('BUTTON / Show', () => {
     cy.visit('/iframe.html?id=button-show--default&args=&viewMode=story')
     cy.get('.button-show').should('exist')
 
-
-// Wait for fonts to load before proceeding
+    // Wait for fonts to load before proceeding
     cy.waitForFontsToLoad().then(() => {
       // Now take Percy snapshot
       cy.percySnapshot('BUTTON / Show: Default')

diff --git a/src/stories/Flexible_MediaWithText.spec.js b/src/stories/Flexible_MediaWithText.spec.js
@@ -5,7 +5,7 @@ describe('FLEXIBLE / Media With Text', () => {
     )
     cy.get('.section-media-with-text').should('exist')
 
-// Wait for fonts to load before proceeding
+    // Wait for fonts to load before proceeding
     cy.waitForFontsToLoad().then(() => {
       // Now take Percy snapshot
       cy.percySnapshot('FLEXIBLE / Media With Text: Default')

diff --git a/src/stories/RichText.spec.js b/src/stories/RichText.spec.js
@@ -5,7 +5,7 @@ describe('GLOBAL/ Rich Text', () => {
     )
     cy.get('.rich-text').should('exist')
 
-// Wait for fonts to load before proceeding
+    // Wait for fonts to load before proceeding
     cy.waitForFontsToLoad().then(() => {
       // Now take Percy snapshot
       cy.percySnapshot('Global / Rich Text: Default')