Noodle No More!.... Jambo! Asanti Sana!

UPDATE. - Loss of styling and Font, due to Linked Files lost (and found) due to SHA fingerprinting after editiing/ de minifying.

Also, I found the source of the apparent Missing Font rendering in PG while working on the remote/locally save site linked above and the missing styles when looking up the locally saved copy of the site to work offline on on and save edits.

It rendedered as shown in the Previous post,
which is now closed/locked, but Ive linked to the image following this.

it was to do with CSS Miniffication… sort of.
More to do with the SHA Integrity fingerprint of that file.

so I had to research the error I was getting in the Brave Dev tools Debug window

Failed to find a valid digest in the ‘integrity’ attribute for resource 'http:/example.com/css/style.min. The resource has been blocked. example.com/:1

and the actual error log was…

For the CSS file

cottonnoodle.com/:1 Failed to find a valid digest in the 'integrity' attribute for resource 'http://localhost/cottonnoodle.com/css/style.min.cb42786aa6b4e2d2678e6e3360b9fa18da572dc3c8212a19fd4682ba76d11cbd.css' with computed SHA-256 integrity 'IqCOd4s88dFqfnadHS0Awzql4ZVQRnTAcd8BKCrBfCQ='. The resource has been blocked.

and for the font,

cottonnoodle.com/:1 Failed to find a valid digest in the 'integrity' attribute for resource 'http://localhost/cottonnoodle.com/css/fonts.min.7a83ffa79db8acf7fde39855ddf21641cd40e88a38aec302c1930769401d436c.css' with computed SHA-256 integrity 'jufqL8xCXqNlZ6gcyHRmomVm7W8JtocwcP0tIy59MU0='. The resource has been blocked.

Well, in order to actually be able to READ the minified css in Pinegrow, Id prettified it or such like so it was humanly readable.

however!
That code now no longer matched its SHA integrity …fingerprint.. thing.
and the browser (not pinegrow,)

BLOCKED both of those files from loading, so no styles and no font.

So removing

integrity="sha256-eoP/p524rPf945hV3fIWQc1A6Io4rsMCwZMHaUAdQ2w=" crossorigin="anonymous"

from the CSS link declaration for css/style.min in the sites index.html header

 <link rel="stylesheet" href="css/fonts.min.7a83ffa79db8acf7fde39855ddf21641cd40e88a38aec302c1930769401d436c.css" integrity="sha256-eoP/p524rPf945hV3fIWQc1A6Io4rsMCwZMHaUAdQ2w=" crossorigin="anonymous">

allowed the site to render beautifully again
and
likewise process to view the Turnip font.

I worked this out by just googling the browsers web tools error console and finding the first result here.

If there’s a more elegant solution. feel free to update me :slight_smile:

Anyway, after all that,
the LOCALLY saved copy of the site now renders beautifully again,
with its Turnip fault too in the Brave Browser.

BUT

the strange thing is, Pinegrow, with its overly zealous (thankfully! or I wouldn’t have found all the errors) Parser,
DIDN’T seem bothered about the whole Integrity/SHA thing!
OR… it rendered the minified CSS file .. as humanly legible, automatically without changing anything, so the file and its integrity wasnt affected.

BUT I was then using VScode to check /edit the code and use the W3C html debugger plugin as suggested by @Emmanuel here

and installed a prettifier to be able to read the no longer minified code and saved this file.
thereby rendering the SHA integrity null and void.

I’m not sure if PG displays minified CSS in humanly readable format by default.

So if anyone else is working on remote sites using Pinegrow and/or browser dev tools and looses styling/fonts etc, when mirroring locally or indeed just unminifiying things,

This might be a Gotchya! To look out for.

I’ve never seen it before.