Trustpilot: window.Trustpilot.loadFromElement is undefined (Safari)

Question

I want to put 3 trustPilots in my Angular app.

import { Component, Input, OnInit } from '@angular/core';
declare global {
    interface Window { Trustpilot: any; }
}
 
window.Trustpilot = window.Trustpilot || {};

@Component({
    selector: 'app-trustbox-normal',
    templateUrl: './trustbox-normal.component.html',
    styleUrls: ['./trustbox-normal.component.scss']
})
export class TrustboxNormalComponent implements OnInit {

    constructor() { }

    ngOnInit(): void { }

    ngAfterViewInit(){
        const trustboxRef = document.getElementById('trustbox');
        window.Trustpilot.loadFromElement(trustboxRef);
    }

}

On the Brave, and Firefox works fine, but in Safari i got an error:
window.Trustpilot.loadFromElement is not a function. (In 'window.Trustpilot.loadFromElement(trustboxRef)', 'window.Trustpilot.loadFromElement' is undefined)

Answer 1

Might be related to this Trustpilot TrustBoxes in Next.js

Have you tried adding a delay to the call of the loadFromElement to give enough time to the Truspilot js script to load?

Answer 2

I removed window.Trustpilot = window.Trustpilot || {}; from the code, and now it's working ok also on Safari.