FlexSearch bar blank on production, but it works on local dev server.

[josephrooks]

No idea where to even start with this after googling it for the last hour, so I'll just include the error it gives me in the browser dev tools console.

None of the “sha256” hashes in the integrity attribute match the content of the subresource at “https://stipe.lexicontent.com/js/flexsearch.433e941a8a573ebb9931fc16fc75266ab6b93f569ac2fb4f3dc66882e0416f4c.js”. The computed hash is “WThFSwNONzCOjfpUpPbhTR5zj2PtN2Y8yiAHZynWLiM=”. 2 3.1-customer-discovery
Uncaught (in promise) ReferenceError: FlexSearch is not defined
    f https://stipe.lexicontent.com/en.search.min.097e3a24da0aba2ac82ef0f53e82e1500343a7126260a0203f3a45bbe0876093.js:1
    o https://stipe.lexicontent.com/en.search.min.097e3a24da0aba2ac82ef0f53e82e1500343a7126260a0203f3a45bbe0876093.js:1
en.search.min.097e3a24da0aba2ac82ef0f53e82e1500343a7126260a0203f3a45bbe0876093.js:1:2769
Uncaught TypeError: can't access property "search", window.pageIndex is undefined
    p https://stipe.lexicontent.com/en.search.min.097e3a24da0aba2ac82ef0f53e82e1500343a7126260a0203f3a45bbe0876093.js:2
21 en.search.min.097e3a24da0aba2ac82ef0f53e82e1500343a7126260a0203f3a45bbe0876093.js:2:500

[josephrooks]

I think I ended up resolving this by copying layouts/_partials/scripts/search.html to my local layouts directory and removing the two instances of integrity="{{ $jsSearch.Data.Integrity }}".

But I'd still like to understand what is going on here and what the ideal fix would be, if not this.

[imfing]

thanks for reporting will look into this

[imfing]

Hey, thanks for the report and for digging into this!

What you're seeing is a Subresource Integrity (SRI) failure. The integrity="sha256-..." hash in the script tag doesn't match what the browser actually downloaded, so the browser blocks it. That's why you get FlexSearch is not defined after.

Hugo computes that hash at build time. If there's a mismatch, it means something changed the file between when you built it and when it got served.

Most likely your CDN or host is transforming the JS somehow. You can confirm by comparing your local public/js/flexsearch.<hash>.js with what's actually served in production. If they differ, check your hosting settings for any JS optimization or transformation features and disable them.