Angular router window.open using ascii in url on first load, second load without closing works

Question

Im trying to open a seperate window in angular. Initially it was done this way, which works:

 const url = `#/(fullscreen:order-line-details-history/${id})`;
        const windowName = 'All Order-line details-history';
        const windowFeatures = 'width=1330,height=650';
        const baseUrl = window.location.origin + window.location.pathname;
        const absoluteUrl = `${baseUrl}${url}`;
        window.open(absoluteUrl, windowName, windowFeatures);
    }

But I added a routeGuard and route data, which resulted in this way not working anymore, so I tried it this way:

        const windowName = 'Order-line details-history';
        const windowFeatures = 'width=1330,height=650';
        const url = this.location.prepareExternalUrl(this.router.serializeUrl(
            this.router.createUrlTree([{outlets: {fullscreen: ['order-line-details-history', id]}}])));
        window.open(url, windowName, windowFeatures);

which results in some odd behavior, opening the screen with the button on the first click creates an error Uncaught (in promise): Error: NG04002: Cannot match any routes. URL Segment: 'order-query%28fullscreen:order-line-details-history/2%29'

It seems using ASCII for the brackets, if I do not close the window that opens and I click the button that navigates to this again, it works fine. But the initial open will never work. I tried encodeURI or decodeURI with no result.