@wearejh/m2-pwa-engine 0.28.0 → 0.30.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (6) hide show
  1. package/CHANGELOG.md +16 -0
  2. package/lib/server/__tests__/__snapshots__/renderShell.test.tsx.snap +8 -4
  3. package/lib/server/__tests__/renderShell.test.tsx +1 -0
  4. package/lib/server/renderShell.tsx +7 -1
  5. package/lib/server/ssrMiddleware.tsx +3 -0
  6. package/package.json +4 -4
package/CHANGELOG.md CHANGED
@@ -3,6 +3,22 @@
3
3
  All notable changes to this project will be documented in this file.
4
4
  See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
5
5
 
6
+ # [0.30.0](https://github.com/WeareJH/mage-mono/compare/v0.29.0...v0.30.0) (2024-09-27)
7
+
8
+ **Note:** Version bump only for package @wearejh/m2-pwa-engine
9
+
10
+
11
+
12
+
13
+
14
+ # [0.29.0](https://github.com/WeareJH/mage-mono/compare/v0.28.0...v0.29.0) (2024-08-02)
15
+
16
+ **Note:** Version bump only for package @wearejh/m2-pwa-engine
17
+
18
+
19
+
20
+
21
+
6
22
  # [0.28.0](https://github.com/WeareJH/mage-mono/compare/v0.25.0...v0.28.0) (2024-07-30)
7
23
 
8
24
  **Note:** Version bump only for package @wearejh/m2-pwa-engine
package/lib/server/__tests__/__snapshots__/renderShell.test.tsx.snap CHANGED
@@ -22,9 +22,10 @@ exports[`inlineCriticalCss: false 1`] = `
22
22
  </noscript>
23
23
  <script id=\\"loadcss\\">!function(t){\\"use strict\\";t.loadCSS||(t.loadCSS=function(){});var e=loadCSS.relpreload={};if(e.support=function(){var e;try{e=t.document.createElement(\\"link\\").relList.supports(\\"preload\\")}catch(t){e=!1}return function(){return e}}(),e.bindMediaToggle=function(t){var e=t.media||\\"all\\";function n(){t.addEventListener?t.removeEventListener(\\"load\\",n):t.attachEvent&&t.detachEvent(\\"onload\\",n),t.setAttribute(\\"onload\\",null),t.media=e}t.addEventListener?t.addEventListener(\\"load\\",n):t.attachEvent&&t.attachEvent(\\"onload\\",n),setTimeout(function(){t.rel=\\"stylesheet\\",t.media=\\"only x\\"}),setTimeout(n,3e3)},e.poly=function(){if(!e.support())for(var n=t.document.getElementsByTagName(\\"link\\"),a=0;a<n.length;a++){var o=n[a];\\"preload\\"!==o.rel||\\"style\\"!==o.getAttribute(\\"as\\")||o.getAttribute(\\"data-loadcss\\")||(o.setAttribute(\\"data-loadcss\\",!0),e.bindMediaToggle(o))}},!e.support()){e.poly();var n=t.setInterval(e.poly,500);t.addEventListener?t.addEventListener(\\"load\\",function(){e.poly(),t.clearInterval(n)}):t.attachEvent&&t.attachEvent(\\"onload\\",function(){e.poly(),t.clearInterval(n)})}\\"undefined\\"!=typeof exports?exports.loadCSS=loadCSS:t.loadCSS=loadCSS}(\\"undefined\\"!=typeof global?global:this)</script>
24
24
 
25
+
25
26
  </head>
26
27
  <body>
27
-
28
+
28
29
  <div id=\\"root\\"><p>hello world</p></div>
29
30
  <script type=\\"text/json\\" id=\\"apollo-client-state\\">{}</script>
30
31
  <script type=\\"text/json\\" id=\\"redux-client-state\\">{}</script>
@@ -68,9 +69,10 @@ exports[`inlineCriticalCss: true 1`] = `
68
69
  </noscript>
69
70
  <script id=\\"loadcss\\">!function(t){\\"use strict\\";t.loadCSS||(t.loadCSS=function(){});var e=loadCSS.relpreload={};if(e.support=function(){var e;try{e=t.document.createElement(\\"link\\").relList.supports(\\"preload\\")}catch(t){e=!1}return function(){return e}}(),e.bindMediaToggle=function(t){var e=t.media||\\"all\\";function n(){t.addEventListener?t.removeEventListener(\\"load\\",n):t.attachEvent&&t.detachEvent(\\"onload\\",n),t.setAttribute(\\"onload\\",null),t.media=e}t.addEventListener?t.addEventListener(\\"load\\",n):t.attachEvent&&t.attachEvent(\\"onload\\",n),setTimeout(function(){t.rel=\\"stylesheet\\",t.media=\\"only x\\"}),setTimeout(n,3e3)},e.poly=function(){if(!e.support())for(var n=t.document.getElementsByTagName(\\"link\\"),a=0;a<n.length;a++){var o=n[a];\\"preload\\"!==o.rel||\\"style\\"!==o.getAttribute(\\"as\\")||o.getAttribute(\\"data-loadcss\\")||(o.setAttribute(\\"data-loadcss\\",!0),e.bindMediaToggle(o))}},!e.support()){e.poly();var n=t.setInterval(e.poly,500);t.addEventListener?t.addEventListener(\\"load\\",function(){e.poly(),t.clearInterval(n)}):t.attachEvent&&t.attachEvent(\\"onload\\",function(){e.poly(),t.clearInterval(n)})}\\"undefined\\"!=typeof exports?exports.loadCSS=loadCSS:t.loadCSS=loadCSS}(\\"undefined\\"!=typeof global?global:this)</script>
70
71
 
72
+
71
73
  </head>
72
74
  <body>
73
-
75
+
74
76
  <div id=\\"root\\"><p>hello world</p></div>
75
77
  <script type=\\"text/json\\" id=\\"apollo-client-state\\">{}</script>
76
78
  <script type=\\"text/json\\" id=\\"redux-client-state\\">{}</script>
@@ -114,9 +116,10 @@ exports[`timestamp: 123456 1`] = `
114
116
  </noscript>
115
117
  <script id=\\"loadcss\\">!function(t){\\"use strict\\";t.loadCSS||(t.loadCSS=function(){});var e=loadCSS.relpreload={};if(e.support=function(){var e;try{e=t.document.createElement(\\"link\\").relList.supports(\\"preload\\")}catch(t){e=!1}return function(){return e}}(),e.bindMediaToggle=function(t){var e=t.media||\\"all\\";function n(){t.addEventListener?t.removeEventListener(\\"load\\",n):t.attachEvent&&t.detachEvent(\\"onload\\",n),t.setAttribute(\\"onload\\",null),t.media=e}t.addEventListener?t.addEventListener(\\"load\\",n):t.attachEvent&&t.attachEvent(\\"onload\\",n),setTimeout(function(){t.rel=\\"stylesheet\\",t.media=\\"only x\\"}),setTimeout(n,3e3)},e.poly=function(){if(!e.support())for(var n=t.document.getElementsByTagName(\\"link\\"),a=0;a<n.length;a++){var o=n[a];\\"preload\\"!==o.rel||\\"style\\"!==o.getAttribute(\\"as\\")||o.getAttribute(\\"data-loadcss\\")||(o.setAttribute(\\"data-loadcss\\",!0),e.bindMediaToggle(o))}},!e.support()){e.poly();var n=t.setInterval(e.poly,500);t.addEventListener?t.addEventListener(\\"load\\",function(){e.poly(),t.clearInterval(n)}):t.attachEvent&&t.attachEvent(\\"onload\\",function(){e.poly(),t.clearInterval(n)})}\\"undefined\\"!=typeof exports?exports.loadCSS=loadCSS:t.loadCSS=loadCSS}(\\"undefined\\"!=typeof global?global:this)</script>
116
118
 
119
+
117
120
  </head>
118
121
  <body>
119
-
122
+
120
123
  <div id=\\"root\\"><p>hello world</p></div>
121
124
  <script type=\\"text/json\\" id=\\"apollo-client-state\\">{}</script>
122
125
  <script type=\\"text/json\\" id=\\"redux-client-state\\">{}</script>
@@ -156,9 +159,10 @@ exports[`works with content 1`] = `
156
159
  </noscript>
157
160
  <script id=\\"loadcss\\">!function(t){\\"use strict\\";t.loadCSS||(t.loadCSS=function(){});var e=loadCSS.relpreload={};if(e.support=function(){var e;try{e=t.document.createElement(\\"link\\").relList.supports(\\"preload\\")}catch(t){e=!1}return function(){return e}}(),e.bindMediaToggle=function(t){var e=t.media||\\"all\\";function n(){t.addEventListener?t.removeEventListener(\\"load\\",n):t.attachEvent&&t.detachEvent(\\"onload\\",n),t.setAttribute(\\"onload\\",null),t.media=e}t.addEventListener?t.addEventListener(\\"load\\",n):t.attachEvent&&t.attachEvent(\\"onload\\",n),setTimeout(function(){t.rel=\\"stylesheet\\",t.media=\\"only x\\"}),setTimeout(n,3e3)},e.poly=function(){if(!e.support())for(var n=t.document.getElementsByTagName(\\"link\\"),a=0;a<n.length;a++){var o=n[a];\\"preload\\"!==o.rel||\\"style\\"!==o.getAttribute(\\"as\\")||o.getAttribute(\\"data-loadcss\\")||(o.setAttribute(\\"data-loadcss\\",!0),e.bindMediaToggle(o))}},!e.support()){e.poly();var n=t.setInterval(e.poly,500);t.addEventListener?t.addEventListener(\\"load\\",function(){e.poly(),t.clearInterval(n)}):t.attachEvent&&t.attachEvent(\\"onload\\",function(){e.poly(),t.clearInterval(n)})}\\"undefined\\"!=typeof exports?exports.loadCSS=loadCSS:t.loadCSS=loadCSS}(\\"undefined\\"!=typeof global?global:this)</script>
158
161
  <script id=\\"modernizr\\">!function(e,n,t){function r(e,n){return typeof e===n}function o(){var e,n,t,o,s,i,l;for(var a in S)if(S.hasOwnProperty(a)){if(e=[],n=S[a],n.name&&(e.push(n.name.toLowerCase()),n.options&&n.options.aliases&&n.options.aliases.length))for(t=0;t<n.options.aliases.length;t++)e.push(n.options.aliases[t].toLowerCase());for(o=r(n.fn,\\"function\\")?n.fn():n.fn,s=0;s<e.length;s++)i=e[s],l=i.split(\\".\\"),1===l.length?Modernizr[l[0]]=o:(!Modernizr[l[0]]||Modernizr[l[0]]instanceof Boolean||(Modernizr[l[0]]=new Boolean(Modernizr[l[0]])),Modernizr[l[0]][l[1]]=o),C.push((o?\\"\\":\\"no-\\")+l.join(\\"-\\"))}}function s(e){var n=_.className,t=Modernizr._config.classPrefix||\\"\\";if(x&&(n=n.baseVal),Modernizr._config.enableJSClass){var r=new RegExp(\\"(^|\\\\\\\\s)\\"+t+\\"no-js(\\\\\\\\s|$)\\");n=n.replace(r,\\"$1\\"+t+\\"js$2\\")}Modernizr._config.enableClasses&&(n+=\\" \\"+t+e.join(\\" \\"+t),x?_.className.baseVal=n:_.className=n)}function i(e,n){return!!~(\\"\\"+e).indexOf(n)}function l(){return\\"function\\"!=typeof n.createElement?n.createElement(arguments[0]):x?n.createElementNS.call(n,\\"http://www.w3.org/2000/svg\\",arguments[0]):n.createElement.apply(n,arguments)}function a(e){return e.replace(/([a-z])-([a-z])/g,function(e,n,t){return n+t.toUpperCase()}).replace(/^-/,\\"\\")}function f(e,n){return function(){return e.apply(n,arguments)}}function u(e,n,t){var o;for(var s in e)if(e[s]in n)return t===!1?e[s]:(o=n[e[s]],r(o,\\"function\\")?f(o,t||n):o);return!1}function c(e){return e.replace(/([A-Z])/g,function(e,n){return\\"-\\"+n.toLowerCase()}).replace(/^ms-/,\\"-ms-\\")}function d(n,t,r){var o;if(\\"getComputedStyle\\"in e){o=getComputedStyle.call(e,n,t);var s=e.console;if(null!==o)r&&(o=o.getPropertyValue(r));else if(s){var i=s.error?\\"error\\":\\"log\\";s[i].call(s,\\"getComputedStyle returning null, its possible modernizr test results are inaccurate\\")}}else o=!t&&n.currentStyle&&n.currentStyle[r];return o}function p(){var e=n.body;return e||(e=l(x?\\"svg\\":\\"body\\"),e.fake=!0),e}function m(e,t,r,o){var s,i,a,f,u=\\"modernizr\\",c=l(\\"div\\"),d=p();if(parseInt(r,10))for(;r--;)a=l(\\"div\\"),a.id=o?o[r]:u+(r+1),c.appendChild(a);return s=l(\\"style\\"),s.type=\\"text/css\\",s.id=\\"s\\"+u,(d.fake?d:c).appendChild(s),d.appendChild(c),s.styleSheet?s.styleSheet.cssText=e:s.appendChild(n.createTextNode(e)),c.id=u,d.fake&&(d.style.background=\\"\\",d.style.overflow=\\"hidden\\",f=_.style.overflow,_.style.overflow=\\"hidden\\",_.appendChild(d)),i=t(c,e),d.fake?(d.parentNode.removeChild(d),_.style.overflow=f,_.offsetHeight):c.parentNode.removeChild(c),!!i}function y(n,r){var o=n.length;if(\\"CSS\\"in e&&\\"supports\\"in e.CSS){for(;o--;)if(e.CSS.supports(c(n[o]),r))return!0;return!1}if(\\"CSSSupportsRule\\"in e){for(var s=[];o--;)s.push(\\"(\\"+c(n[o])+\\":\\"+r+\\")\\");return s=s.join(\\" or \\"),m(\\"@supports (\\"+s+\\") { #modernizr { position: absolute; } }\\",function(e){return\\"absolute\\"==d(e,null,\\"position\\")})}return t}function v(e,n,o,s){function f(){c&&(delete N.style,delete N.modElem)}if(s=r(s,\\"undefined\\")?!1:s,!r(o,\\"undefined\\")){var u=y(e,o);if(!r(u,\\"undefined\\"))return u}for(var c,d,p,m,v,g=[\\"modernizr\\",\\"tspan\\",\\"samp\\"];!N.style&&g.length;)c=!0,N.modElem=l(g.shift()),N.style=N.modElem.style;for(p=e.length,d=0;p>d;d++)if(m=e[d],v=N.style[m],i(m,\\"-\\")&&(m=a(m)),N.style[m]!==t){if(s||r(o,\\"undefined\\"))return f(),\\"pfx\\"==n?m:!0;try{N.style[m]=o}catch(h){}if(N.style[m]!=v)return f(),\\"pfx\\"==n?m:!0}return f(),!1}function g(e,n,t,o,s){var i=e.charAt(0).toUpperCase()+e.slice(1),l=(e+\\" \\"+P.join(i+\\" \\")+i).split(\\" \\");return r(n,\\"string\\")||r(n,\\"undefined\\")?v(l,n,o,s):(l=(e+\\" \\"+z.join(i+\\" \\")+i).split(\\" \\"),u(l,n,t))}function h(e,n,r){return g(e,t,t,n,r)}var C=[],S=[],w={_version:\\"3.6.0\\",_config:{classPrefix:\\"\\",enableClasses:!0,enableJSClass:!0,usePrefixes:!0},_q:[],on:function(e,n){var t=this;setTimeout(function(){n(t[e])},0)},addTest:function(e,n,t){S.push({name:e,fn:n,options:t})},addAsyncTest:function(e){S.push({name:null,fn:e})}},Modernizr=function(){};Modernizr.prototype=w,Modernizr=new Modernizr;var _=n.documentElement,x=\\"svg\\"===_.nodeName.toLowerCase(),b=\\"Moz O ms Webkit\\",P=w._config.usePrefixes?b.split(\\" \\"):[];w._cssomPrefixes=P;var z=w._config.usePrefixes?b.toLowerCase().split(\\" \\"):[];w._domPrefixes=z;var E={elem:l(\\"modernizr\\")};Modernizr._q.push(function(){delete E.elem});var N={style:E.elem.style};Modernizr._q.unshift(function(){delete N.style}),w.testAllProps=g,w.testAllProps=h,Modernizr.addTest(\\"flexboxlegacy\\",h(\\"boxDirection\\",\\"reverse\\",!0)),o(),s(C),delete w.addTest,delete w.addAsyncTest;for(var T=0;T<Modernizr._q.length;T++)Modernizr._q[T]();e.Modernizr=Modernizr}(window,document);</script>
162
+
159
163
  </head>
160
164
  <body>
161
-
165
+
162
166
  <div id=\\"root\\"><p>Hello world!</p></div>
163
167
  <script type=\\"text/json\\" id=\\"apollo-client-state\\">{}</script>
164
168
  <script type=\\"text/json\\" id=\\"redux-client-state\\">{}</script>
package/lib/server/__tests__/renderShell.test.tsx CHANGED
@@ -25,6 +25,7 @@ it('timestamp: 123456', function () {
25
25
 
26
26
  function setup(input: Partial<InputParams> = {}, result: Partial<SsrResult> = {}): string {
27
27
  const actual = fromResult({
28
+ beforeHeadEnd: '',
28
29
  afterBodyStart: '',
29
30
  assetPrefix: 'dist',
30
31
  beforeBodyEnd: '',
package/lib/server/renderShell.tsx CHANGED
@@ -24,6 +24,7 @@ type HtmlProps = {
24
24
  title?: string;
25
25
  link?: string;
26
26
  meta?: string;
27
+ beforeHeadEnd?: string;
27
28
  beforeBodyEnd?: string;
28
29
  afterBodyStart?: string;
29
30
  version?: string;
@@ -46,6 +47,7 @@ export function renderShell(props: HtmlProps) {
46
47
  title = '<!-- title missing -->',
47
48
  link = '<!-- link elements missing -->',
48
49
  meta = '<!-- meta element missing -->',
50
+ beforeHeadEnd = '',
49
51
  beforeBodyEnd = '',
50
52
  afterBodyStart = '',
51
53
  lang = 'en',
@@ -65,9 +67,10 @@ export function renderShell(props: HtmlProps) {
65
67
  ${cssFiles(css)}
66
68
  ${LOAD_CSS}
67
69
  ${ie11 ? MODERNIZR : ''}
70
+ ${beforeHeadEnd}
68
71
  </head>
69
72
  <body>
70
- ${afterBodyStart}
73
+ ${afterBodyStart}
71
74
  <div id="root">${content}</div>
72
75
  ${gqlState(state)}
73
76
  ${renderReduxState(reduxState)}
@@ -91,6 +94,7 @@ export interface InputParams {
91
94
  distDir: string;
92
95
  domain: string;
93
96
  version: string;
97
+ beforeHeadEnd: string;
94
98
  afterBodyStart: string;
95
99
  beforeBodyEnd: string;
96
100
  runtimeEnv: RuntimeEnv;
@@ -111,6 +115,7 @@ export function fromResult(input: InputParams): (result: SsrResult) => string {
111
115
  assetPrefix,
112
116
  legacyStats,
113
117
  stats,
118
+ beforeHeadEnd,
114
119
  beforeBodyEnd,
115
120
  afterBodyStart,
116
121
  domain,
@@ -145,6 +150,7 @@ export function fromResult(input: InputParams): (result: SsrResult) => string {
145
150
  title: helmet.title.toString(),
146
151
  link: helmet.link.toString(),
147
152
  meta: helmet.meta.toString(),
153
+ beforeHeadEnd,
148
154
  beforeBodyEnd,
149
155
  afterBodyStart,
150
156
  domain,
package/lib/server/ssrMiddleware.tsx CHANGED
@@ -64,6 +64,7 @@ export function getSSRMiddleware(parameters: {
64
64
  backend: string;
65
65
  domain: string;
66
66
  version: string;
67
+ beforeHeadEnd: string;
67
68
  afterBodyStart: string;
68
69
  beforeBodyEnd: string;
69
70
  errorHtml(params: { error: Error }): string;
@@ -77,6 +78,7 @@ export function getSSRMiddleware(parameters: {
77
78
  domain,
78
79
  distDir,
79
80
  version,
81
+ beforeHeadEnd,
80
82
  afterBodyStart,
81
83
  beforeBodyEnd,
82
84
  assetPrefix,
@@ -102,6 +104,7 @@ export function getSSRMiddleware(parameters: {
102
104
  legacyStats,
103
105
  stats,
104
106
  distDir,
107
+ beforeHeadEnd,
105
108
  beforeBodyEnd,
106
109
  afterBodyStart,
107
110
  domain,
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@wearejh/m2-pwa-engine",
3
- "version": "0.28.0",
3
+ "version": "0.30.0",
4
4
  "description": "> TODO: description",
5
5
  "author": "Shane Osbourne <shane.osbourne8@gmail.com>",
6
6
  "homepage": "",
@@ -18,10 +18,10 @@
18
18
  ],
19
19
  "scripts": {},
20
20
  "dependencies": {
21
- "@wearejh/m2-pwa-vars": "^0.28.0",
22
- "@wearejh/swagger-rxjs": "^0.28.0",
21
+ "@wearejh/m2-pwa-vars": "^0.30.0",
22
+ "@wearejh/swagger-rxjs": "^0.30.0",
23
23
  "history": "^4.10.1",
24
24
  "loadcss": "^0.0.2"
25
25
  },
26
- "gitHead": "7fafabd9c93a5f95b4b4794bc650da1bb599b480"
26
+ "gitHead": "f8e8f2cf23751858479e7127ce0143ca11b149e9"
27
27
  }