fix: add support for SSR

wa0x6e · Mar 27, 2023 · 47080ec · 47080ec
1 parent 95906c3
commit 47080ec
Show file tree

Hide file tree

Showing 2 changed files with 29 additions and 16 deletions.
diff --git a/src/helpers/DateHelper.ts b/src/helpers/DateHelper.ts
@@ -41,17 +41,24 @@ export default class DateHelper {
   constructor() {
     this.locale = DEFAULT_LOCALE;
     this.timezone = dayjs.tz.guess();
-    (window as any).dayjs ||= dayjs;
+    if (typeof window !== undefined) {
+      (window as any).dayjs ||= dayjs;
+    }
   }
 
   async setup({ options }: { options: OptionsType }) {
     this.timezone = options.date.timezone || dayjs.tz.guess();
     const userLocale = options.date.locale;
 
     if (typeof userLocale === 'string' && userLocale !== DEFAULT_LOCALE) {
-      const locale =
-        (window as any)[`dayjs_locale_${userLocale}`] ||
-        (await this.loadLocale(userLocale));
+      let locale;
+      if (typeof window !== undefined) {
+        locale =
+          (window as any)[`dayjs_locale_${userLocale}`] ||
+          (await this.loadBrowserLocale(userLocale));
+      } else {
+        locale = await this.loadNodeLocale(userLocale)
+      }
       dayjs.locale(userLocale);
       this.locale = locale;
     }
@@ -217,7 +224,7 @@ export default class DateHelper {
 
   // this function will work cross-browser for loading scripts asynchronously
   // eslint-disable-next-line class-methods-use-this
-  loadLocale(userLocale: string): Promise<any> {
+  loadBrowserLocale(userLocale: string): Promise<any> {
     return new Promise((resolve, reject) => {
       const s = document.createElement('script');
       s.type = 'text/javascript';
@@ -232,4 +239,8 @@ export default class DateHelper {
       document.head.appendChild(s);
     });
   }
+
+  loadNodeLocale(userLocale: string): Promise<any> {
+    return import(`dayjs/locale/${userLocale}`);
+  }
 }
diff --git a/test/helpers/DateHelper.test.ts b/test/helpers/DateHelper.test.ts
@@ -15,8 +15,8 @@ describe('DateHelper', () => {
   let options: Options;
   let dateHelper: DateHelper;
 
-  const loadLocaleMock = jest
-    .spyOn(DateHelper.prototype, 'loadLocale')
+  const loadBrowserLocaleMock = jest
+    .spyOn(DateHelper.prototype, 'loadBrowserLocale')
     .mockImplementation(() => Promise.resolve(locale_fr));
 
   beforeEach(async () => {
@@ -31,27 +31,29 @@ describe('DateHelper', () => {
         options.init({ date: { locale: 'en' } });
         await dateHelper.setup(options);
         expect(dateHelper.date().locale()).toEqual('en');
-        expect(loadLocaleMock).not.toHaveBeenCalled();
+        expect(loadBrowserLocaleMock).not.toHaveBeenCalled();
         expect(dateHelper.locale).toBe('en');
       });
     });
 
     describe('when using no locale value', () => {
       it('instantiate dayjs with default EN locale', () => {
-        expect(loadLocaleMock).not.toHaveBeenCalled();
+        expect(loadBrowserLocaleMock).not.toHaveBeenCalled();
         expect(dateHelper.date().locale()).toEqual('en');
         expect(dateHelper.locale).toBe('en');
       });
     });
 
     describe('when using locale FR', () => {
-      it('instantiate dayjs with the FR locale', async () => {
-        options.init({ date: { locale: 'fr' } });
-        await dateHelper.setup(options);
-        expect(loadLocaleMock).toHaveBeenCalledTimes(1);
-        expect(dateHelper.date().locale()).toEqual('fr');
-        expect(dateHelper.locale).toHaveProperty('name');
-      });
+      describe('on browser env', () => {
+        it('instantiate dayjs with the FR locale', async () => {
+          options.init({ date: { locale: 'fr' } });
+          await dateHelper.setup(options);
+          expect(loadBrowserLocaleMock).toHaveBeenCalledTimes(1);
+          expect(dateHelper.date().locale()).toEqual('fr');
+          expect(dateHelper.locale).toHaveProperty('name');
+        });
+      })
     });
   });