1

In my Google Chrome extension I load content script using manifest.json like this:

  "content_scripts": [
    {
      "matches": ["https://stackoverflow.com/questions/tagged/*sort=newest*"],
      "css":     ["content.css"],
      "js":      ["content.js"]
    }
  ]

When I now browse to https://stackoverflow.com/questions/tagged/sql?sort=newest&pageSize=15 the content.js is successfully injected, but the content.css is just ignored.

But when I change the matches pattern to just https://stackoverflow.com/questions/tagged/*, both are loaded and applied correctly.

Is that a bug in Chrome or is using multiple asterisks in the URL not allowed? But why does it work for JS then? The matches pattern documentation explicitly allows "<any chars>" in the path part of the URL. Any idea how to make that work, except from injecting CSS styles into the page manually?

I also tried without success:

  • Adding "permissions":["tab", "https://stackoverflow.com/"] to the manifest
  • Adding "web_accessible_resources": ["content.css"] to the manifest
  • Separating content script declaration into two objects for JS and CSS

Edit:

It's getting worse. I just found include_globs and tried this instead:

  "content_scripts": [
    {
      "matches":       ["https://stackoverflow.com/*"],
      "include_globs": ["*/questions/tagged/*sort=newest*"]
      "css":           ["content.css"],
      "js":            ["content.js"]
    }
  ]

JS is injected only into the newest questions page, as it should, but CSS gets now applied to the whole stackoverflow site. Is CSS pattern matching just broken?

Community
  • 1
  • 1
djk
  • 943
  • 2
  • 9
  • 27

0 Answers0