如何在不重新加载页面的情况下从 FF web 扩展 content_script 更改第三方网站上的 angular 应用程序路由/URL

Question

I have built a FF extension that loads a bunch of stock market symbols from "a.com".

Then in my FF browser the extension needs to programaticaly change the currently loaded route in site "b.com" which uses angularJS.

I do not own nor have access to change the code on site "b.com", except via the FF extension. My extension uses jQuery and vanilla JS.

HINT: On b.com when I search for a stock symbol in a search input field (represented here by the CSS selector ".symbol-lookup-field input") then hit enter, it changes the route and its fast.

ATTEMPT #1: I can change the current route obviously by simply changing the whole window URL like this: window.location.href = 'https://b.com/trading/quote/A/chart';

However this takes forever to load and since I need to browse a hundred of these URLs I need this to be fast enough.

ATTEMPT 2: So I tried to simulate an enter keypress/keydown event (tried both) and they fire correctly from a jQuery point of view when I setup an event listener for ENTER key, however it does not end up performing the same action as if I were to hit enter on my keyboard. So that solution ended up not working for me. Note that the search field gets a green BG color so its not a CSS selector problem.

Here is my code for that part:

var myKeyDown = function(event){
    if ((event.keyCode) == 13) {
        alert('Enter keydown triggered');
        $(this).off('keydown',myKeyDown);
    }
};
$(".symbol-lookup-field input").off('keydown',myKeyDown).on('keydown',myKeyDown);
var e = jQuery.Event("keydown");
e.which = 13;
e.keyCode = 13;
$(".symbol-lookup-field input").css("background-color",'#e2efd5');
$(".symbol-lookup-field input").trigger(e).trigger("blur");

ATTEMPT #3: The other solution is to find a way to change the route externally from oustide an angular app that is already loaded. Does anyone knows a way to change the current route of an AngularJS App from a FF extension content_script?

So for now Im stuck as none of the 3 solutions work good enough for needed use. Anybody has a clue what to type to change the angular app route?

NOTES:

• b.com website uses angular v1.5.8.
• I can access the document & window object from the FF extension.
• b.com uses directive/ngApp

Answer 1

I finally found a solution.

Since we can push history items on any browser, I used this with the last part being the URL I need the angular app to display:

window.history.pushState({},null, '/trading/quote/A/chart');

in order to change the URL in the browser. Because $location module/service in angular watches for url changes "live", the change is being picked up inside the angular app and is reflected by what is being displayed properly.

That solves the problem.