How to intercept a specific XHR request?

Question

I'm trying to intercept a request to a specific URL and override the XMLHttpRequest.prototype.send through a chrome extension and I'm using typescript. I can't read the URL through it, and I don't know how to verify that the URL being requested/sent to is the specific one I'm trying to intercept. How do I work around this?

Here's what I have so far:

import topStreamQuery from './queries/topStreams';

console.log('injected');

const operationOverrides = {
    Endpoint: 'https://gql.twitch.tv/gql',
    ClientID: 'kimne78kx3ncx6brgo4mv6wki5h1ko',

    getTopStreams: JSON.stringify([
        {
            operationName: 'GET_TOP_STREAMS',
            query: topStreamQuery,
            amount: 25,
        },
    ]),
};

const oldXHROpen: (method: string, url: string) => void =
    XMLHttpRequest.prototype.open;
const oldXHRSend: (body?: string) => void = XMLHttpRequest.prototype.send;
const XHR = XMLHttpRequest.prototype;

XMLHttpRequest.prototype.open = function (method: string, url: string): void {
    console.log('request started');
    const oldUrl = url;
    let args = arguments;

    if (
        oldUrl ===
        'https://www.youtube.com/youtubei/v1/browse?key=AIzaSyAO_FJ2SlqU8Q4STEHLGCilw_Y9_11qcW8&prettyPrint=false'
    ) {
        args[1] = url.replace(oldUrl, operationOverrides.Endpoint);

        this.addEventListener('load', function () {
            console.log(this.readyState);
            console.log(this.responseText);
            console.log('working helo');
        });
    }
    return oldXHROpen.apply(this, args);
};

XMLHttpRequest.prototype.send = function (body?: string) {
    console.log(XMLHttpRequest);
    console.log('on send');
    const oldBody = body;
    let args = arguments;

    console.log(args);

    this.setRequestHeader('Client-Id', 'kimne78kx3ncx6brgo4mv6wki5h1ko');
    args[0] = body.replace(oldBody, JSON.stringify([topStreamQuery]));

    return oldXHRSend.apply(this, args);
};