Define the comunication protocol between page and extension for requesting credentials

[Andrei0105]

Current provisional (PoC) solution:

1. The inpage.js script is injected in the page. The page can fully access functions/variables defined within this script.
2. One of these functions is requestUportClaims, an event handler which takes the event as parameter and passes its data to the content script via window.postMessage, with message type 'iw-up-rc' for requesting uPort credentials. Additionally, a message with type 'open-popup' is sent to request the opening of the uPort popup.
3. The webpage creates a button using requestUportClaims as its callback. It passes as parameter an object with attributes 'simple' and 'verified' denoting 2 arrays holding the names of requested uPort credentials either verified or not.
4. Upon clicking the button by the user, the content script receives the messages described. For the 'iw-up-rc' message, it adds to a global variable, pendingData, the message. For the 'open-popup' message, it sends a message with the type 'openPopup' using sendMessage. The message is for the background script.
5. The background script receives the 'openPopup' message and opens the popup.
6. In the popup, the checkVariable function (called using a timeout) checks that uportconect is defined, and afterwards sends a 'requestData' message (sendMessage) to the content script.
7. The content script replies (sendMessage) with the data in the pendingData variable.
8. The popup receives the data, and calls getCreds using the two arrays for verified and not verified credentials.

!!! NOTE: currently step 6 does not work as the active tab will be the popup instead of the webpage.

This provisional solution has to be defined as a final solution to be used in the final version. Main areas to improve: the global variable pendingData from the content script.

[Andrei0105]

Step 6 fixed at commit https://github.com/Andrei0105/identity-wallet/commit/1e1d768381adbd5f00ae61480160bdd6ac834c51.

[Andrei0105]

Updated steps: Current provisional (PoC) solution:

1. The inpage.js script is injected in the page. The page can fully access functions/variables defined within this script.
2. One of these functions is requestUportClaims, an event handler which takes the event as parameter and passes its data to the content script via window.postMessage, with message type 'iw-up-rc' for requesting uPort credentials. Additionally, a message with type 'open-popup' is sent to request the opening of the uPort popup.
3. The webpage creates a button using requestUportClaims as its callback. It passes as parameter an object with attributes 'simple' and 'verified' denoting 2 arrays holding the names of requested uPort credentials either verified or not.
4. Upon clicking the button by the user, the content script receives the messages described. For the 'iw-up-rc' message, it adds to a global variable, pendingData, the message. For the 'open-popup' message, it sends a message with the type 'openPopup' using sendMessage. The message is for the background script.
5. The background script receives the 'openPopup' message and opens the popup, and stores the tab ID from which it received the message in the local storage for the popup to be able to contact the page.
6. In the popup, the checkVariable function (called using a timeout) checks that uportconect is defined, and afterwards sends a 'requestData' message (sendMessage) to the content script (to the tab ID found in local storage.).
7. The content script replies (sendMessage) with the data in the pendingData variable.
8. The popup receives the data, and calls getCreds using the two arrays for verified and not verified credentials.

[Andrei0105]

Diagram of communication. Step numbers not the same as above.

[Andrei0105]

Communication steps:

1. The inpage script (IS) will contain the library to which the page will have access. Mainly functions to be used as event handlers for user actions to be able to send requests to the background (e.g. "Login with uPort / Identity Wallet"). Possible to also include creating the button, etc, more complex functionality.
2. IS sends the request to the content script (CS) using window.postMessage.
3. CS has to store the data until the popup (P) is opened and can read it.
4. CS sends a open popup request to the background script (BG) using runtime.sendMessage.
5. BG stores the sender tabId of the open popup message in local storage and opens P.
6. P sends requestData to CS using tabs.sendMessage after getting the tabId from storage.
7. CS replies with the pendingData using runtime.sendMessage.
8. P gets claims from uPort and sends fillFields to CS using tabs.sendMessage and.
9. CS received the data and fills the fields.

Updates:

3. CS stores the data in local storage. Steps 6 and 7 are replaced with P reads the data from local storage.

[Andrei0105]

Implemented at https://github.com/Andrei0105/identity-wallet/commit/63b8d6a0fddfd3d6282025d68cf35cabf365c37b.

[Andrei0105]

Change the way fields are filled. The page should receive the claims and decide what to do with them. The extension should not fill the fields itself.

[Andrei0105]

Implemented at https://github.com/Andrei0105/identity-wallet/commit/8fa96564321a5dcbe91a171df39413be1fed23d8.