Issue with Manifest V3 URL matches that contain a path - javascript

I get the Invalid value for 'web_accessible_resources[0]'. Invalid match pattern. error when trying to load my extension. I've made sure to read the match pattern documentation, and to my understanding, "https://www.example.com/example" should be a valid match pattern.
I've made an example of a manifest that will trigger the error:
{
"manifest_version": 3,
"name": "Test",
"description": "Test",
"version": "0.0.1",
"web_accessible_resources": [
{
"resources": [
"/js/script.js"
],
"matches":[
"https://www.example.com/example"
],
"use_dynamic_url": true
}
]
}
Does anyone know why it wouldn't work, is it a bug in Chrome?

Related

Getting/setting value from Jquery UI Datepicker returns undefine from chrome extension

I'm using chrome extension to automate my few tasks, one of them is to select the date from datepicker. but i'm unable to perform actions on Jquery UI datepicker by using its methods such as:
$(".hasDatepicker").datepicker("setDate", new Date("01/03/2022"));
or getting date:
$(".hasDatepicker").datepicker("getDate");
i display the result in console and it returns undefine.
Inside manifest file, i also included the jquery-ui.js file, here it is:
{
"manifest_version": 3,
"name": "Auto Cart",
"version": "1.0",
"content_scripts": [
{
"matches": [
"https://www.billetterie-parismusees.paris.fr/*"
],
"js": [
"jquery.js",
"jquery-ui.js",
"content.js"
]
}
],
"action": {
"default_popup": "popup.html"
},
"permissions": ["storage","activeTab"]
}
Important:
I can get and set values of datepicker from console but it doesn't work from content-script.js file.
Can anyone pls help me in resolving this issue?

Read an element within an iframe

I'm building an Edge extension. I'm trying to get the exact same element as this question asks, but I want to use JS, not Selenium.
Element
I'm running the JS through my extension's background script. In the future, I would like the popup to have a button and that button to read the syllable on screen.
The provided solution is in Selenium and I'd like to transpile it into JS.
driver.switch_to_frame(driver.find_element_by_xpath("//div[#class='game']/iframe[contains(#src,'jklm.fun')]"))
If none of this works, I guess I'll have to use optical text recognition.
Here's manifest.json
{
"name": "myName",
"description": "myDescription",
"version": "1.0.0",
"manifest_version": 3,
"icons": {
"128": "myIcon.png"
},
"content_scripts": [
{
"matches": [
"https://jklm.fun/*"
],
"js": [
"js/myScript.js"
]
}
]
}
Inside js folder, here's myScript.js
console.log('myscript is running')
const syllableHandler = () => {
const iframe = document.getElementsByTagName("iframe")
console.log(iframe?.[0]?.contentWindow)
}
document.addEventListener('keydown', syllableHandler)

Visual Studio Code extension development problem with typescript

as you see above, the building process never finishes and no extension host window appears.
the problem also exists when all extensions all disabled
but this problem doesn't exist when creating project with javascript (the problem is only with typescript)
the steps that I follow is from this tutorial
and I also tried the hello world sample from github.
but none of them worked.
EDIT:
I tried to open extension development host window manually by code --extensionDevelopmentPath="path/to/my/project" and it worked.
I think the issue is with some of vscode's configurations
possible fix: I should check the configurations such as npm: watch. but I don't know where are they and what should I do with them??
so any idea?
EDIT 2:
task.json
// See https://go.microsoft.com/fwlink/?LinkId=733558
// for the documentation about the tasks.json format
{
"version": "2.0.0",
"tasks": [
{
"type": "npm",
"script": "watch",
"problemMatcher": "$tsc-watch",
"isBackground": true,
"presentation": {
"reveal": "never"
},
"group": {
"kind": "build",
"isDefault": true
}
}
]
}
launch.json
// A launch configuration that compiles the extension and then opens it inside a new window
// Use IntelliSense to learn about possible attributes.
// Hover to view descriptions of existing attributes.
// For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
{
"version": "0.2.0",
"configurations": [
{
"name": "Run Extension",
"type": "extensionHost",
"request": "launch",
"args": [
"--extensionDevelopmentPath=${workspaceFolder}"
],
"outFiles": [
"${workspaceFolder}/out/**/*.js"
],
"preLaunchTask": "${defaultBuildTask}"
},
{
"name": "Extension Tests",
"type": "extensionHost",
"request": "launch",
"args": [
"--extensionDevelopmentPath=${workspaceFolder}",
"--extensionTestsPath=${workspaceFolder}/out/test/suite/index"
],
"outFiles": [
"${workspaceFolder}/out/test/**/*.js"
],
"preLaunchTask": "${defaultBuildTask}"
}
]
}
then I noticed that if I comment out "preLaunchTask": "${defaultBuildTask}" in launch.json file, the problem solves.
Finally I caught the issue. that was because of the locale of my system that was set to Persian which typescript problem matcher couldn't recognize(Persian digits).
By setting system locale to English the problem solved and everything now works fine as expected.
please see the issue on github

Can't import tensorflow.js in chrome extension

I am developing a chrome extension, where I use my trained keras model. For this I need to import a library tensorflow.js. How should I do that?
I tried to import tensorflow.js in my project by two ways:
in background.js by import * as tf from '#tensorflow/tfjs';
I downloaded tf.min.js and tried to add it in my manifest.json
manifest.json
{
"manifest_version": 2,
"name": "my_project",
"version": "0.1",
"background": {
"scripts": ["background.js", "tf.min.js"]
},
"content_scripts": [
{
"matches": [
"<all_urls>"
],
"js": ["jquery-3.1.1.min.js","content.js"]
}
]
}
In the first case the error was "unexpected token *";
and in the second case the error was Uncaught (in promise) ReferenceError: tf is not defined.
What did I do wrong?
I downloaded tf.min.js and tried to add it in my manifest.json
Try putting the tf.min.js first, like this:
{
"background": {
"scripts": ["tf.min.js", "background.js"]
}
}
The scripts are loaded in the order you specify them and if you want to be able to use things from tf.min.js inside of background.js, tf.min.js has to be loaded first.

Chrome extension replace JavaScript function on a website

I want to create a Chrome extension that replaces (overrides) existing function on a specific website.
I tried to define the manifest like this:
{
"name": "My extension",
"version": "1",
"description": "desc",
"manifest_version": 2,
"content_scripts": [
{
"matches": ["http://www.mywebsite.com/*"],
"js": ["jquery-1.3.2.js", "content.js"]
}
]
}
And I put the new function in content.js, but it's not working. How can I fix it?
EDIT:
My content.js file contains a single Javascript function. it looks like this:
function fullLoad(ent)
{
loadNow(ent);
}
I want that this function will override the real fullLoad function in the website.
How can I do it?

Categories

Resources