Issues in Safari with <base href> w/workaround

[bunjiboys]

It would seem the gauges break with a standard Angular setup having a <base href="/"> tag in your file (this is set when you generate a new project using the angular cli). When looking at the gauges in Safari, you see the text, but the svg-paths are not rendering because its unable to find the generated filters.

This can either by fixed by setting the explicit url to the current path in the filter="url(...)" block. For example if your file is called index.html, you would change the filter from

filter="url(#inner-shadow-undefined)"

to

filter="url(index.html#inner-shadow-undefined)"

Another workaround is to not use the <base href="/"> tag, but instead use the providers on the base NgModule declaration

@NgModule({
    declarations: [AppComponent],
    imports: [AppRoutingModule, HttpClientModule, BrowserModule, BrowserAnimationsModule],
    providers: [
        {provide: APP_BASE_HREF, useValue: '/'}
    ],
    bootstrap: [AppComponent],
})

I understand that this may be upstream in JustGage that some of this may need to be fixed (if you want to use option 1, to still allow use of <base href>), but at the very least I think this should be documented for this project, since this project is specifically meant to be used within Angular projects

Edit:
Upon further investigation, using the APP_BASE_HREF approach seems to not work correctly using lazy-loaded modules