1

This JavaScript statement WAS valid in previous Chrome versions(as part of a Chrome extension content.js) in 5 months ago:

require(["function-widget-1:share/util/service/createLinkShare.js"]).prototype.makePrivatePassword=function(){return prompt("Some Massage:","")};

But now (in latest Chrome, as part of a Chrome extension content.js) it is invalid and the error massage is "Uncaught ReferenceError: require is not defined".

However, it is now (in latest Chrome) still valid if I type the same statement into the Chrome console (as in Developer Tools).

So my question is: What made the difference between the two scenarios?

  • `require` is not a defined function in my Chrome… Are you sure you didn't include a `require` implementation yourself somewhere? – deceze May 30 '17 at 07:45
  • @deceze I believe it is included by the page that the extension was supposed to work on – Luke Shining May 30 '17 at 07:53
  • 1
    The console has a context selector. By default it's the page itself. In order for your extension to access the page context you need to inject the code in a script element, otherwise the content script has no access to page functions because it runs in an isolated environment. – wOxxOm May 30 '17 at 08:49
  • @wOxxOm Thank you but I think I do have them injected in the page by including the . js files in the manifest.json file/content js part – Luke Shining May 30 '17 at 09:15
  • 1
    There's a huge difference between injecting the content script and injecting the code in a script element. – wOxxOm May 30 '17 at 09:17
  • @deceze Thank you so much. My problem was finally solved(see answer below). – Luke Shining May 30 '17 at 20:14
  • @wOxxOm Thank you so much. You are right but I failed to understand your point. – Luke Shining May 30 '17 at 20:17

1 Answers1

1

What you're seeing is called "Isolated world":

Content scripts execute in a special environment called an isolated world. They have access to the DOM of the page they are injected into, but not to any JavaScript variables or functions created by the page. It looks to each content script as if there is no other JavaScript executing on the page it is running on. The same is true in reverse: JavaScript running on the page cannot call any functions or access any variables defined by content scripts.

Essentially, content scripts run in a completely separate JS context (think "virtual machine") attached to the same DOM tree and don't see each other's code.

When using the Dev Tools console, you can switch JS contexts with a drop-down above it (initially says "top"). It should list already present content script contexts.

It is possible to cross the boundary and have some code running in the page's own context; this technique is colloquially called "injected scripts" (not to be confused with programmatic injection of content scripts) or "page-level scripts" and are canonically covered by this question.

However, any code that crosses this boundary becomes hard to communicate with - as it becomes indistinguishable from the page's own code, which is, as noted, is invisible to content scripts. A couple of questions that cover this: with content script, with background.

Xan
  • 74,770
  • 16
  • 179
  • 206
  • Thank you so much! This is exactly what I'm looking for. The AMD style 'require()' was implemented by a ' – Luke Shining May 30 '17 at 20:12