lightGallery icon indicating copy to clipboard operation
lightGallery copied to clipboard

No icons displayed in Firefox Developer Edition - downloadable font: rejected by sanitizer (Angular)

Open Robouste opened this issue 3 months ago • 0 comments

Description

No icons displayed in firefox in production. (works fine in local but with a warning).

downloadable font: rejected by sanitizer (font-family: "lg" style:normal weight:400 stretch:100 src index:0) source: https://mywebsite.be/lg.955a4bcf92186ac4.woff2?io9a6k downloadable font: rejected by sanitizer (font-family: "lg" style:normal weight:400 stretch:100 src index:1) source: https://mywebsite.be/lg.dc565ab5551f1c21.ttf?io9a6k downloadable font: rejected by sanitizer (font-family: "lg" style:normal weight:400 stretch:100 src index:2) source: https://mywebsite.be/lg.c950f0b5c587534c.woff?io9a6k

Here is the warning when working locally:

downloadable font: Glyph bbox was incorrect (glyph ids 25 27) (font-family: "lg" style:normal weight:400 stretch:100 src index:0) source: http://localhost:4200/lg.woff2?io9a6k

Steps to reproduce

Angular application in production mode

JS code that you use to initialize lightGallery.

protected lgSettings: LightGallerySettings = {
    selector: ".thumbnail",
    plugins: [lgZoom, lgThumbnail],
    licenseKey: LIGHT_GALLERY_KEY,
};

Sample HTML markup

<lightgallery class="light-gallery" [settings]="lgSettings" [onInit]="onLgInit">
    @for (img of allScreenshots; track img) {
      <div class="thumbnail" [attr.data-src]="img.image">
        <img [src]="img.thumbnail" />
        @if (img.type === "custom") {
          <button mat-mini-fab class="delete-button" color="warn" (click)="onDeleteScreenshot(img, $event)">
            <mat-icon>delete</mat-icon>
          </button>
        }
      </div>
    }
  </lightgallery>

Environment

  • Browser and version - Firefox Developer Edition, v125.0b6
  • OS - Windows
  • lightGallery version - 2.7.2

Additional context

This is working fine in Chrome, I haven't tried with the classic edition of Firefox. The error appears once I click on a picture. I have tried to set gfx.downloadable_fonts.sanitize to false in about:config but it didn't work (I'd rather keep it activated anyway).

Here is how I import scss:

styles.scss

@import "./styles/lightgallery";

lightgallery.scss

@import "lightgallery/scss/lightgallery";
@import "lightgallery/scss/lg-thumbnail";
@import "lightgallery/scss/lg-zoom";

Robouste avatar Apr 01 '24 09:04 Robouste