Microapplications referencing <embed-page> demo, Embeddable Progressive Applications Working Group

Applications ( web pages ) in browser environment are referencing each other via direct Window object reference and by name via several APIs like window.frames, window.open, and target attribute on FORM or A link.

<embed-page> uses same API to reference other microapplication windows ( instances of <embed-page> ) and parent application ( parent window ).

While the direct reference to window object via window.open assumes the straight ownership relation ( only creator has reference to child and child has back reference to parent ), the named windows have a "global" in browser scope. Meaning different apps could use same name ( legit or not aside ) to reference another application(window). In JS it is counted a bad practice to use global variables as it threatens the integrity of application. On application level it threatens even more: cross-application integrity and user safety.

To solve the issue of global nature of named application window, <embed-page/> limits the iteration of named apps to child/parent and scoping by target groups defined by parent. This way the visibility (and referencing by target ) is limited to parent-child tree. The child could see the parent and only siblings under same target scope.

See window.frames and window.open for details.

Manual test
ENVIRONMENT
    appsList-microapp.html is served in two IFRAMEs named
    A & B, main incognito embed-page instance and two pairs of named(A&B) embed-page instances.

    The A & B names of IFRAME are used to test a "target" in A and FORM,
    In embed-page pair ( united by same target attribute: X & Y) same link and form will
    target the embed-page instance with same name AND within same (X or Y) embed-page group.

    If the instance with name does not exist in the group, a new embed-page instance will
    be created immediately after originating one and available within group. Refresh the matrix
    before checking the values.

COMMON SEQUENCE
    to be run in IFRAMEs, X, and Y groups. When content is updated, check the list of window.frames
    which should have only instances from same group.

    1. appsList-microapp.html.js will list 'name' and 'target'
       attributes of window.parent and all in window.frames along with page URL.
    2. In instance with name=A click the link with target A. The content should be replaced by url
        with "link=A" parameter.
    3. In instance with name=B, click the link with target B. The content of instance with name=B
       should be replaced by url with "link=B" parameter.
    4. In instance with name=A submit the form with target A. The content should be replaced by url
        with "form=A" parameter.
    5. In instance with name=B submit the form with target B, . The content of instance with name=B
       should be replaced by url with "form=B" parameter.
    6. In instance with name=A click the link with target C. New instance should be created next to
        clicked with url "link=C" parameter.
    7. Close instance created in #6 by 'X' button.
    8. In instance with name=B submit the form with target C. New instance should be created next to
        clicked with url "form=C" parameter.
    9. In instance with name=B click the link with target C. The content of instance with name=C
       (created in #8 ) should be replaced by url with "link=C" parameter.
    10.In instance with name=C(last created) submit the form with target C.
        The content of this instance should be replaced by url with "form=C" parameter.
    11. Close instance created in #8 by 'X' button.
    12. "Open A" button should replace content of instance A with url parameter "open=A"
    13. "Open B" button should replace content of instance B with url parameter "open=B"
    14. "Open C" button should create             instance C with url parameter "open=C"
    15. close instance C by 'X' button.


Group 'X'
Group 'Y'
Demo IFRAME page-storage.html
name=Aname=B
Output of appsList-microapp.html.js

windownametargeturl
NOTE. In demo page the list does not include the 'C' frame. Dynamically opened windows are not enumerable.