Skip to content

Expose sketch source when executed in the https://preview.p5js.com iframe #2372

@kilometers

Description

@kilometers

Increasing Access

Allow for educational coding support tools (in my case a chrome extension supporting debugging) to have cleaner access to user's raw code. Features like this could support a rich ecosystem of third party tools working with the p5js editor.

Feature request details

Error messages are already accessible thanks to postMessage() sending 'message' events, however cleanly accessing the source which was executed is a challenge. One can rig this by cleaning the raw code in the CodeMirror element, however from what I can tell this only shows the currently open file and not what is necessarily run in the preview iframe.

The editor could use postMessage() when a preview is run to send out a 'message' event containing the code or a way to expose their blobs, perhaps with the following structure:

editor.postMessage(
    {
      source: 'sketch',
      messages: [
        {
          log: [
            {
              method: 'source',
              data: [executedSource],
              id: Date.now().toString()
            }
          ]
        }
      ]
    },
    editorOrigin
  );

In my use case it would be quite convenient if the executed code was sent along with the error message, or if the "source" message and the "error" message (assuming there is an error on execution) were guaranteed to share an id.

I've scoured the code for a way to access the sketch source from outside React/Redux in a robust, clean way -- if it already exists then perhaps this isn't needed.

Metadata

Metadata

Assignees

No one assigned

    Labels

    Feature RequestProposal for adding a new functionalityNeeds DiscussionRequires further conversation or consensus

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions