@sitecore-feaas/clientside 0.1.29 → 0.1.30

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sitecore-feaas/clientside",
-  "version": "0.1.29",
+  "version": "0.1.30",
   "scripts": {
     "start": "webpack serve --open",
     "build": "rm -rf dist;npm run types; npm run build:esbuild; npm run build:sourcemaps",

package/scripts/build.js

@@ -22,7 +22,8 @@ function compile({ input, output, ...step }) {
       '_MAGIC_IMPORT_COMMENTS_ESBUILD_WORKAROUND__',
       'linkedom',
       'react',
-      'react-dom'
+      'react-dom',
+      'vm'
     ],
 
     ...step,
@@ -74,13 +75,13 @@ function compile({ input, output, ...step }) {
   { input: 'build/ui/index.js', output: 'dist/node/index.js', platform: 'node', format: 'cjs' },
   { input: 'build/ui/index.js', output: 'dist/node/index.esm.js', platform: 'node', format: 'esm' },
   { input: 'build/ui/react.js', output: 'dist/node/react.js', platform: 'node', format: 'cjs' },
-  { input: 'build/ui/react.js', output: 'dist/node/index.esm.js', platform: 'node', format: 'esm' },
+  { input: 'build/ui/react.js', output: 'dist/node/react.esm.js', platform: 'node', format: 'esm' },
   { input: 'build/headless.js', output: 'dist/node/headless.js', platform: 'node', format: 'cjs' },
   { input: 'build/headless.js', output: 'dist/node/headless.esm.js', platform: 'node', format: 'esm' },
   { input: 'build/ui/index.js', output: 'dist/browser/index.js', platform: 'browser', format: 'cjs' },
   { input: 'build/ui/index.js', output: 'dist/browser/index.esm.js', platform: 'browser', format: 'esm' },
-  { input: 'build/ui/react.js', output: 'dist/browser/react.js', platform: 'node', format: 'cjs' },
-  { input: 'build/ui/react.js', output: 'dist/browser/index.esm.js', platform: 'node', format: 'esm' },
+  { input: 'build/ui/react.js', output: 'dist/browser/react.js', platform: 'browser', format: 'cjs' },
+  { input: 'build/ui/react.js', output: 'dist/browser/react.esm.js', platform: 'browser', format: 'esm' },
   { input: 'build/headless.js', output: 'dist/browser/headless.js', platform: 'browser', format: 'cjs' },
   { input: 'build/headless.js', output: 'dist/browser/headless.esm.js', platform: 'browser', format: 'esm' }
 ].map((step) => {

package/src/components/FEAASComponent.tsx

@@ -127,7 +127,7 @@ export class FEAASComponent extends FEAASBase<FEAASComponentsProps, string> {
       return
     }
     if (this.props.withStylesheet) {
-      var stylesheetPromise = loadStylesheetAllowStale(this.props).then(() => {
+      var stylesheetPromise = loadStylesheetAllowStale({ ...this.props, revision: 'published' }).then(() => {
         stylesheetPromise = null
         if (this.payload) {
           this.onLoad(this.payload)

package/src/dom/stylesheet.ts

@@ -21,7 +21,7 @@ export function loadStylesheet(props: FEAASCDNStylesheetParams, callback?: Valid
   if (!foundStylesheet) {
     var createdStylesheet = createStylesheet(props)
   }
-  return fetchAndRevalidateStylesheet(props, (cssText, phase) => {
+  return fetchAndRevalidateStylesheet({ ...props }, (cssText, phase) => {
     if (createdStylesheet) {
       createdStylesheet.textContent = cssText
     }

package/src/ui/react.tsx

@@ -1,6 +1,5 @@
-import { FEAASComponentProps } from '../headless.js'
-
 export * from './index.js'
+import { FEAASComponentProps } from './index.js'
 import React from 'react'
 
 export function FEAASEmbed({ data, ...props }: FEAASComponentProps & { src: string }) {

package/test/FEAASStylesheet.test.tsx

@@ -1,7 +1,7 @@
 import { afterAll, beforeEach, beforeAll, describe, expect, it, vi } from 'vitest'
 import { FEAASStylesheet } from '../src/components/FEAASStylesheet.js'
 import { renderDOMContent } from '../src/dom/rendering.js'
-import { clearFetchCache, loadStylesheet } from '../src/headless.js'
+import { clearFetchCache, DEFAULT_CDN_URL, loadStylesheet } from '../src/headless.js'
 
 const earliest = new Date(2000, 1, 1, 0, 0, 0)
 const earlier = new Date(2000, 1, 2, 0, 0, 0)
@@ -46,6 +46,27 @@ describe('Stylesheet', () => {
 
     expect(document.head.querySelector('style').textContent).toContain('TODAY')
   })
+  it('should load stylesheet with minimum parameters(cold cache)', async () => {
+    const spy = vi.spyOn(global, 'fetch')
+    spy.mockImplementation(async (url: string, options: Parameters<typeof fetch>[1] = {}) => {
+      if (url.match(DEFAULT_CDN_URL + '/styles/L/published.css'))
+        return new Response('TODAY {}', {
+          headers: {
+            date: now.toUTCString(),
+            'last-modified': earlier.toUTCString()
+          }
+        })
+    })
+
+    document.body.innerHTML = '<feaas-stylesheet library="L"></feaas-stylesheet>'
+
+    const stylesheet = document.body.firstElementChild as FEAASStylesheet
+
+    await expect(stylesheet.whenRendered).resolves.toEqual(stylesheet)
+    expect(spy).toHaveBeenCalledTimes(1)
+
+    expect(document.head.querySelector('style').textContent).toContain('TODAY')
+  })
 
   it('should invalidate stylesheet cache', async () => {
     const spy = vi.spyOn(global, 'fetch')