Переопределить пользовательскую функцию для использования встроенной функции с использованием расширения Chrome

Question

Я довольно новичок в JS и создаю расширение для Chrome, где я использую функцию Array.filter, но для некоторых веб-сайтов владелец веб-сайта создал собственную функцию Array.filter, поведение которой отличается от встроенной функции.Есть ли способ переопределить эту пользовательскую функцию и получить собственное поведение этой функции.Любая помощь будет оценена.

Answer 1

Чтобы сохранить оригинальный метод фильтра Array #, вы просто сохраняете его в переменной, а затем используете его при необходимости, используя call():

//Saving the original method
var ArrayFilter = Array.prototype.filter;
//Then whenever needing to use it, call it by using call()
var someArray = [1,2,3];
var filteredArray = ArrayFilter.call(someArray,function(){ /* your filter callback */ });

Теперь вам нужно сделатьэтот запуск перед сценарием, который создает модифицированный метод filter().Вы должны будете сделать это, изменив, в какой момент ваш контент-скрипт загружается, чтобы он мог загрузить другой код.Это можно сделать, установив run_at в манифесте:

манифест:

"content_scripts": [
  {
    "matches": ["http://*.example.com/*"],
    "run_at": "document_start",
    "js": ["contentScript.js"]
  }
],

contentScript.js

//injecting the script into the page
//or however you are currently doing it
var yourScript = document.createElement('script');
document.head.appendChild(yourScript);
yourScript.textContent = "/* your js code */";

Answer 2

Запустите ваш код перед скриптами страницы и используйте Object.defineProperty , чтобы переопределить метод и запретить последующие изменения. Вам нужно поместить этот код в элемент DOM script, чтобы он выполнялся в контексте страницы ( more info ), используя буквальную строку, а не свойство src, чтобы гарантировать, что он предшествует любой другой странице сценарии ( подробнее ).

manifest.json:

"content_scripts": [{
  "matches": ["https://foo.bar/*"],
  "js": ["content.js"],
  "run_at": "document_start",
  "all_frames": true
}]

content.js:

const script = document.createElement("script");
script.textContent = `
  Object.defineProperty(Array.prototype, 'filter', {
    value: Array.prototype.filter,
    configurable: false,
    writable: false,
  });
`;
document.documentElement.appendChild(script);
script.remove();