Fix issue #255, exposes site url and editor url to JS and editor

[schalkneethling]

@jwhitlock This should be sufficient to expose the needed URLs to the JS in kuma and, make available a postMessage target call for the editor to get its parent URL.

Anything here that concern you security wise? Anything you would do different? Thanks!

[codecov-io]

Codecov Report

Merging #4404 into master will increase coverage by <.01%.
The diff coverage is 100%.

@@            Coverage Diff             @@
##           master    #4404      +/-   ##
==========================================
+ Coverage   94.73%   94.73%   +<.01%     
==========================================
  Files         254      254              
  Lines       22620    22621       +1     
  Branches     1666     1666              
==========================================
+ Hits        21428    21429       +1     
  Misses        963      963              
  Partials      229      229

Impacted Files	Coverage Δ
kuma/settings/common.py	94.29% <100%> (+0.02%)	⬆️

---

Continue to review full report at Codecov.

Legend - Click here to learn more
Δ = absolute <relative> (impact), ø = not affected, ? = missing data
Powered by Codecov. Last update 8ab1304...2fb93cb. Read the comment docs.

[escattone]

@jwhitlock @schalkneethling

Since @schalkneethling needs access to the editor URL (and the survey URL, which is not yet part of this PR) within kumascript macros as well, and since we'd prefer to have those settings in one place (here in kuma) rather than also having them somewhere in the kumascript settings, I'm proposing we should do the following (either in this PR or a related one):

• make the INTERACTIVE_EXAMPLES_BASE setting configurable from the environment, like INTERACTIVE_EXAMPLES_BASE = config('INTERACTIVE_EXAMPLES_BASE', default='https://interactive-examples.mdn.mozilla.net') so we can set it from docker-compose.yml for local development
• add an INTERACTIVE_EXAMPLES_SURVEY = config('INTERACTIVE_EXAMPLES_SURVEY', default='https://www.surveygizmo.com/s3/3780959/MDN-Interactive-Editor')
• add these two key/value pairs to the env vars passed to kumascript both here and here, which adds them to the env global variable available within all kumascript macros (which is what @schalkneethling needs). For example, maybe we could add them like so:

env_vars = {
    ...
    'interactiveExamplesBaseURL': settings.INTERACTIVE_EXAMPLES_BASE,
    'interactiveExamplesSurveyURL': settings.INTERACTIVE_EXAMPLES_SURVEY,
}

which could be accessed within the kumascript macros like this:

env.interactiveExamplesBaseURL

• add the proper local development setting for INTERACTIVE_EXAMPLES_BASE in the docker-compose.yml worker environment

What do you guys think?

[jwhitlock]

@escattone that works for me. It is a little strange to pass this value, but it is also trivial to make it a KumaScript setting if that makes more sense in the future.

For speed, I think a backend dev should make those changes. @escattone, do you want to make these changes in a follow-on commit, or should I?

I think https://interactive-examples.mdn.mozilla.net is the right default for development, until we add a container for interactive examples development to the docker dev environment.

[jwhitlock]

This looks good to me, with one nit. @escattone has ideas for making it configurable from the environment, and for extending it to KumaScript, which could be done in the context of this PR or a new one.

[jwhitlock]

This should use config so it can be set from the environment, like:

INTERACTIVE_EXAMPLES_BASE = config('https://interactive-examples.mdn.mozilla.net', default='https://interactive-examples.mdn.mozilla.net')

[escattone]

@jwhitlock It is a little strange. Maybe my desire not to repeat code is leading me down an un-natural path. I'm happy to just add it as a setting in kumascript as well. Maybe that's more natural.

[escattone]

@jwhitlock I'll make the changes in a new kumascript PR, and I think I'll just add the settings to kumascript.

[stephaniehobson]

Do we need to include the survey URL in this? It's going away in a few weeks and there isn't a staging version vs a production version.

[stephaniehobson]

Data objects on the HTML tag feel like the wrong way to pass these to javascript. Can we make them part of our global MDN object with the other javascript config stuff in config.html

[schalkneethling]

Can we make them part of our global MDN object with the other javascript config stuff in config.html

Most definitely, I was not aware of this file. Let me move it there and make the relevant updates.

[jwhitlock]

Should this be https://interactive-examples.mdn.mozilla.net?

[schalkneethling]

Crud, indeed. Copy/paste fail. Let me update it.

[schalkneethling]

Fixed up.

[jwhitlock]

This change worked locally, after I made some further changes to the Docker configuration. Your branch doesn't allow commits from maintainers, so I'll open a new PR for the changes:

• set INTERACTIVE_EXAMPLES_BASE in the kuma containers
• set interactive_examples__base_url in the kumascript container
• use bug 760240: provide interactive-examples settings to macros kumascript#306
• make some changes in interactive-examples to change domain from https://developer.mozilla.org to http://localhost:8000

https://github.com/mdn/interactive-examples/blob/b05330eac3bb104ff23022220f132c477f558c1d/js/editor-libs/analytics.js#L12

https://github.com/mdn/interactive-examples/blob/b05330eac3bb104ff23022220f132c477f558c1d/js/editor-libs/events.js#L92

• Run interactive-examples locally
• make up, and maybe docker-compose restart redis.