subfont 6.12.0 → 6.12.2

package/CHANGELOG.md

@@ -1,3 +1,13 @@
+### v6.12.2 (2022-11-02)
+
+- [Be resilient when an insertion point cannot be found for subfont's preloads and stylesheets Fixes assetgraph\/assetgraph\#1251](https://github.com/Munter/subfont/commit/75beca70fb6cf696cf958326d8ea65b31d125b71) ([Andreas Lind](mailto:andreaslindpetersen@gmail.com))
+
+### v6.12.1 (2022-09-11)
+
+- [Map font-style: oblique to font-variation-settings: slnt -14](https://github.com/Munter/subfont/commit/ea96284729e0d100fcb87d09c63979641439b169) ([Andreas Lind](mailto:andreaslindpetersen@gmail.com))
+- [Fix typo in test case](https://github.com/Munter/subfont/commit/b07273ff0daff38a23ef9b0ce77d5a114c4e2154) ([Andreas Lind](mailto:andreaslindpetersen@gmail.com))
+- [Improve slnt axis test case with a copy of the Extendomatic font Should be OK according to the license: https:\/\/djr.com\/license\/\#server https:\/\/twitter.com\/djrrb\/status\/1568539078416539654?s=20&t=P3w5SKI\_UHV3zzrBMj47lQ](https://github.com/Munter/subfont/commit/f6692fc3ad17a745bda13d1eb78ccd5fb340b369) ([Andreas Lind](mailto:andreaslindpetersen@gmail.com))
+
 ### v6.12.0 (2022-09-07)
 
 - [Refactor repeated code into helper function](https://github.com/Munter/subfont/commit/5335d931957cadc150fed1c5d548ee6b6e245636) ([Andreas Lind](mailto:andreaslindpetersen@gmail.com))

package/lib/subsetFonts.js

@@ -829,8 +829,11 @@ function warnAboutUnusedVariationAxes(
       if (fontStyles.has('oblique')) {
         // https://www.w3.org/TR/css-fonts-4/#font-style-prop
         // oblique <angle>?
-        // [...] The lack of an <angle> represents 14deg.
-        noteUsedValue(fontUrl, 'slnt', 14);
+        //   [...] The lack of an <angle> represents 14deg.
+        // And also:
+        //   Note: the OpenType slnt axis is defined with a positive angle meaning a counter-clockwise slant, the opposite direction to CSS.
+        // sThe CSS implementation will take this into account when using variations to produce oblique faces.
+        noteUsedValue(fontUrl, 'slnt', -14);
       }
       // If any font-style value except oblique is seen (including normal or italic)
       // we're also utilizing value 0:
@@ -1248,10 +1251,27 @@ async function subsetFonts(
     fontUsages,
     accumulatedFontFaceDeclarations,
   } of htmlOrSvgAssetTextsWithProps) {
-    const insertionPoint = assetGraph.findRelations({
+    let insertionPoint = assetGraph.findRelations({
       type: `${htmlOrSvgAsset.type}Style`,
       from: htmlOrSvgAsset,
     })[0];
+
+    // Hackingly deal with the original stylesheet being located inside <noscript>
+    // https://github.com/assetgraph/assetgraph/issues/1251
+    if (!insertionPoint && htmlOrSvgAsset.type === 'Html') {
+      for (const htmlNoScript of assetGraph.findRelations({
+        type: 'HtmlNoscript',
+        from: htmlOrSvgAsset,
+      })) {
+        if (
+          assetGraph.findRelations({ from: htmlNoScript.to, type: 'HtmlStyle' })
+            .length > 0
+        ) {
+          insertionPoint = htmlNoScript;
+          break;
+        }
+      }
+    }
     const subsetFontUsages = fontUsages.filter(
       (fontUsage) => fontUsage.subsets
     );
@@ -1288,19 +1308,20 @@ async function subsetFonts(
 
     if (unsubsettedFontUsagesToPreload.length > 0) {
       // Insert <link rel="preload">
-      unsubsettedFontUsagesToPreload.map((fontUsage) => {
+      for (const fontUsage of unsubsettedFontUsagesToPreload) {
         // Always preload unsubsetted font files, they might be any format, so can't be clever here
-        return htmlOrSvgAsset.addRelation(
+        const preloadRelation = htmlOrSvgAsset.addRelation(
           {
             type: 'HtmlPreloadLink',
             hrefType,
             to: fontUsage.fontUrl,
             as: 'font',
           },
-          'before',
+          insertionPoint ? 'before' : 'firstInHead',
           insertionPoint
         );
-      });
+        insertionPoint = insertionPoint || preloadRelation;
+      }
     }
 
     if (subsetFontUsages.length === 0) {
@@ -1430,16 +1451,17 @@ async function subsetFonts(
         // - https://caniuse.com/#search=preload
 
         if (htmlOrSvgAsset.type === 'Html') {
-          htmlOrSvgAsset.addRelation(
+          const htmlPreloadLink = htmlOrSvgAsset.addRelation(
             {
               type: 'HtmlPreloadLink',
               hrefType,
               to: fontAsset,
               as: 'font',
             },
-            'before',
+            insertionPoint ? 'before' : 'firstInHead',
             insertionPoint
           );
+          insertionPoint = insertionPoint || htmlPreloadLink;
         }
       }
     }
@@ -1450,9 +1472,10 @@ async function subsetFonts(
           inlineCss || htmlOrSvgAsset.type === 'Svg' ? 'inline' : hrefType,
         to: cssAsset,
       },
-      'before',
+      insertionPoint ? 'before' : 'firstInHead',
       insertionPoint
     );
+    insertionPoint = insertionPoint || cssRelation;
 
     if (!omitFallbacks && inlineCss && unusedVariantsCss) {
       // The fallback CSS for unused variants needs to go into its own stylesheet after the crude version of the JS-based preload "polyfill"

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "subfont",
-  "version": "6.12.0",
+  "version": "6.12.2",
   "description": "Speeds up your pages initial paint by automatically subsetting local or Google fonts and loading them optimally",
   "engines": {
     "node": ">=10.0.0"