feat(82791): add method to trigger external navigation

README.md

@@ -3,7 +3,7 @@ A SDK for the client part of plugin developed for 360Learning products
 
 ## Getting started
 
-First, import sdk to your project : 
+First, import sdk to your project :
 ```
 yarn add 360learning-plugin-client-sdk
 
@@ -12,7 +12,7 @@ yarn add 360learning-plugin-client-sdk
 npm install 360learning-plugin-client-sdk
 ```
 
-Then create a sdk instance 
+Then create a sdk instance
 ```typescript
 import { createSDK } from “360learning-plugin-client-sdk”;
 
@@ -42,3 +42,13 @@ await sdk.init();
 
 const user = await sdk.fetch("api/v2/uaa/users/me", { method: "GET" });
 ```
+
+### navigateToExternalUrl
+
+`navigateToExternalUrl` is used to trigger a navigation to an external website. This would make the page to leave the 360Learning website.
+
+```typescript
+const sdk = createSDK();
+
+sdk.navigateToUrl("http://github.com");
+```

src/SDK.test.ts

@@ -8,6 +8,7 @@ import type { MockInstance } from "vitest";
 
 describe("SDK", () => {
     let requestConnectionDetailsStub: MockInstance<typeof messaging.requestConnectionDetails>;
+    let requestExternalNavigationStub: MockInstance<typeof messaging.requestExternalNavigation>;
 
     beforeEach(() => {
         vi.spyOn(headers, "buildHeaders").mockReturnValue({});
@@ -132,6 +133,21 @@ describe("SDK", () => {
             await expect(promise).rejects.toThrowError("Error 403 received from the API");
         });
     });
+
+    describe("navigateToExternalUrl", () => {
+        beforeEach(() => {
+            requestExternalNavigationStub = vi.spyOn(messaging, "requestExternalNavigation").mockReturnValue();
+        });
+
+        it("should request external navigation", () => {
+            const url = "an url";
+            const sdk = new SDK();
+
+            sdk.navigateToExternalUrl(url);
+
+            expect(requestExternalNavigationStub).toHaveBeenCalledWith(url);
+        });
+    });
 });
 
 function buildUnauthorizedResponse() {

src/SDK.ts

@@ -1,6 +1,6 @@
 import { APIError } from "./errors";
 import { buildAuthedHeaders, buildHeaders } from "./headers";
-import { requestConnectionDetails } from "./messaging";
+import { requestConnectionDetails, requestExternalNavigation } from "./messaging";
 
 const PLUGIN_AUTH_ENDPOINT = "api/v2/plugin/oauth2/client-token";
 const STATUS_CODE_UNAUTHORIZED_401 = 401;
@@ -44,6 +44,10 @@ export class SDK {
         await this.authenticate();
     }
 
+    navigateToExternalUrl(url: string) {
+        requestExternalNavigation(url);
+    }
+
     private async authenticate() {
         const { apiBaseUrl, temporaryToken } = await requestConnectionDetails();
         this.apiBaseUrl = apiBaseUrl;

src/messaging.test.ts

@@ -1,6 +1,6 @@
 import { afterEach, beforeEach, describe, expect, it, vi } from "vitest";
 
-import { requestConnectionDetails } from "./messaging";
+import { requestConnectionDetails, requestExternalNavigation } from "./messaging";
 
 describe("messaging", () => {
     describe("requestTemporaryToken", async () => {
@@ -41,4 +41,24 @@ describe("messaging", () => {
             await expect(promise).resolves.toEqual({ temporaryToken, apiBaseUrl });
         });
     });
+
+    describe("requestExternalNavigation", () => {
+        let postMessageSpy
+
+        beforeEach(() => {
+            postMessageSpy = vi.spyOn(window.parent, "postMessage");
+        });
+
+        it("should post message to request navigation", () => {
+            const url = "an url";
+
+            requestExternalNavigation(url);
+
+            expect(postMessageSpy).toHaveBeenCalledWith({
+                type: "plugin:requestExternalNavigation",
+                url,
+                version: 1
+            }, "*")
+        });
+    });
 });

src/messaging.ts

@@ -1,5 +1,6 @@
 const PLUGIN_CONNECTION_DETAILS_EVENT_TYPE = "plugin:connectionDetails";
 const PLUGIN_REQUEST_CONNECTION_DETAILS_EVENT_TYPE = "plugin:requestConnectionDetails";
+const PLUGIN_REQUEST_EXTERNAL_NAVIGATION_EVENT_TYPE = "plugin:requestExternalNavigation";
 
 const MAX_LISTENER_TIME_IN_MS = 1000 * 60;
 
@@ -36,4 +37,12 @@ export async function requestConnectionDetails(): Promise<ConnectionDetails> {
             reject();
         }
     });
+}
+
+export async function requestExternalNavigation(url: string) {
+    window.parent.postMessage({
+        type: PLUGIN_REQUEST_EXTERNAL_NAVIGATION_EVENT_TYPE,
+        url,
+        version: 1
+    }, "*");
 }