CORS header(s) to be added

[delchev]

Description

I would like to run my WebIDE in Che 7 (dev) - Eclipse Dirigible. I have prepared the necessary descriptors, publish them, configure the workspace and it runs successfully. The issue is that Dirigible WebIDE requires access to the top level page objects e.g. window, to communicate between the components served via iframes.

Ref: https://enable-cors.org/

Reproduction Steps

The plugin sources:
https://github.com/dirigiblelabs/dirigible-che-editor-plugin
Published at OpenShift:
https://che-plugin-registry-delchevn.4e1e.starter-us-east-1b.openshiftapps.com/plugins/dirigible-che-editor-plugin:1.0.0

In the Che wrapper page e.g. https://che.openshift.io/dashboard/#/ide/XXX/wksp-uknv
it appears only the side-bar of Dirigible.
In the standalone/direct link e.g. https://routeom5ypznw-XXX-che.4e1e.starter-us-east-1b.openshiftapps.com/services/v3/web/ide/index.html
it functioning normally.

OS and version:
Che 7 dev

Diagnostics:
A possible fix would be all the hosts serving the Che workspace components to be allowed via CORS headers to have access to the top level Che wrapper page.
Another option is the workspace link from the Che side-bar to open the WebIDE in a new window instead of the embedded iframe.

[skabashnyuk]

can you share your workspace config?

[slemeur]

cc @slemeur

[l0rd]

cc @ashumilova @evidolob

[skabashnyuk]

Have some issues to reproduce this on OpenShift

[benoitf]

It was the first issue but AFAIK Dirigible docker image has been fixed to handle that.
@delchev ?

[skabashnyuk]

As far as I can see all images starting from root https://github.com/eclipse/dirigible/tree/master/releng

[delchev]

Sorry! I was pushed it manually yesterday for my tests. Now it is fixed via eclipse-dirigible/dirigible#361 and updated https://hub.docker.com/r/dirigiblelabs/dirigible-anonymous/tags/ by the CI

Just start again your test workspace. Initially it will give an error that the application is not available, but after a few seconds (Dirigible's bootstrap time) you can reload the iframe and it appears.

[delchev]

this is my workspace config:

{
  "projects": [],
  "commands": [
    {
      "commandLine": "echo ${CHE_OSO_CLUSTER//api/console}",
      "name": "Get OpenShift Console URL",
      "type": "",
      "attributes": {}
    }
  ],
  "defaultEnv": "default",
  "environments": {
    "default": {
      "recipe": {
        "contentType": "application/x-yaml",
        "type": "openshift",
        "content": "kind: List\nitems:\n - \n  apiVersion: v1\n  kind: Pod\n  metadata:\n   name: ws\n  spec:\n   containers:\n    - \n     image: wsskeleton/che-plugin-dev-tooling\n     name: dev\n     resources:\n      limits:\n       memory: 512Mi\n"
      },
      "machines": {
        "ws/dev": {
          "servers": {},
          "volumes": {
            "projects": {
              "path": "/projects"
            }
          },
          "installers": [],
          "env": {},
          "attributes": {
            "memoryLimitBytes": "536870912"
          }
        }
      }
    }
  },
  "name": "wksp-uknv",
  "attributes": {
    "che.server.secure_exposer": "default",
    "plugins": "che-machine-exec-plugin:0.0.1",
    "editor": "https://che-plugin-registry-delchevn.4e1e.starter-us-east-1b.openshiftapps.com/plugins/dirigible-che-editor-plugin:1.0.0"
  },
  "links": []
}

[skabashnyuk]

@delchev I was able to reproduce this issue. Can you clarify what will happen when we enable cors? I mean what Eclipse Dirigible are going to do with the parent frame?

[delchev]

@skabashnyuk , we would like to to use window.postMessage() and window.addEventListener() https://developer.mozilla.org/en-US/docs/Web/API/Window/postMessage for cross-iframe communication. To be able to do so, we need permissions for the top level page. In a standalone Dirigible we load the message-hub.js script in the top level page itself, that's why it works even on OpenShift as a standalone app. When the Dirigible's WebIDE is embedded within another outer page it does not have permissions by default to manipulate window object. The CORS headers set this permissions and the browser allow a page fed from the exact location (from CORS) to access window object. We need only permissions for the hosts/containers from the same workspace not the whole OpenShift which will be security issue.

[skabashnyuk]

@delchev I've talked with @vitaliy-guliy . And we have such question.
Is this code https://github.com/eclipse/dirigible/blob/master/ide/ui/ide-core/src/main/resources/ide-core/ui/message-hub.js#L34
and Eclipse Dirigible itself expect that parent iframe can be loaded from another host?

Because this error looks that they are not expected.


And this is not http request where CORS can help. We tend to think that this more message-hub.js issue.

[delchev]

Thanks a lot @skabashnyuk and @vitaliy-guliy for the quick investigation! We with @shturec tried to dynamically resolve the 'top' dirigible's window in our code. The fix was provided with: eclipse-dirigible/dirigible#362 and eclipse-dirigible/dirigible#363 and it works just fine:

[skabashnyuk]

Cool.
@delchev Can you let us know:

• when a new image will be available?
• are you going to submit dirigible editor https://github.com/eclipse/che-plugin-registry

[delchev]

Thanks @skabashnyuk !
For completeness the pull request for https://github.com/eclipse/che-plugin-registry is eclipse-che/che-plugin-registry#54
and the new image built by CI at:
https://hub.docker.com/r/dirigiblelabs/dirigible-anonymous/tags/