Merge pull request #11 from guardian/rp_fix_dependabot

update dependancies

__tests__/components/AppSwitcher/TestLoginComponent.tsx

@@ -9,21 +9,24 @@ import {OAuthContext} from "../../../src";
 import {OAuthContextData, UserContext, UserContextProvider} from "../../../src";
 
 describe("LoginComponent", ()=> {
-    let assignSpy:jest.SpyInstance<any,[string]>;
+    const realLocation = global.location
 
     beforeEach(()=>{
-        assignSpy = jest.spyOn(window.location,"assign");
-        jest.useFakeTimers()
+        // @ts-ignore
+        delete global.location
+        jest.useFakeTimers();
+        global.location = { ...realLocation, assign: jest.fn() }
     });
     afterEach(()=>{
-        assignSpy.mockRestore();
+        // @ts-ignore
+        delete global.location
         jest.clearAllTimers();
         jest.useRealTimers();
     });
 
     it("should set up an interval on load to check login state", () => {
+        jest.spyOn(global, 'setInterval');
         const loginExpiredCb = sinon.spy();
-
         const mockLoginData: JwtDataShape = {
             aud: "my-audience",
             iss: "my-idP",
@@ -58,11 +61,11 @@ describe("LoginComponent", ()=> {
         const mockRefresh = sinon.stub();
         mockRefresh.returns(Promise.resolve());
 
-        const mockLoginData: JwtDataShape = {
+        const mockLoginData:JwtDataShape = {
             aud: "my-audience",
             iss: "my-idP",
-            iat: 123456,
-            exp: 78910,
+            iat: new Date().getTime() / 1000,
+            exp: (new Date().getTime() / 1000)+30,
         };
 
         const mockUserContext:UserContext = {
@@ -88,10 +91,9 @@ describe("LoginComponent", ()=> {
         expect(rendered.find("#refresh-failed").length).toEqual(0);
         expect(rendered.find("#refresh-success").length).toEqual(0);
 
-        await act(() => {
+        await act(async() => {
             rendered.update();
             jest.advanceTimersByTime(60001);
-            Promise.resolve();
         });
 
         expect(mockRefresh.calledOnceWith("https://fake-token-uri")).toBeTruthy();
@@ -125,7 +127,7 @@ describe("LoginComponent", ()=> {
             aud: "my-audience",
             iss: "my-idP",
             iat: new Date().getTime() / 1000,
-            exp: (new Date().getTime() / 1000)+30,
+            exp: (new Date().getTime() / 1000) + 90,
         };
 
 
@@ -157,7 +159,7 @@ describe("LoginComponent", ()=> {
         expect(mockRefresh.calledOnceWith("https://fake-token-uri")).toBeTruthy();
 
         await act(()=>Promise.resolve());    //this allows other outstanding promises to resolve _first_, including the one that
-                                    //sets the component state and calls loginRefreshedCb
+                                                    //sets the component state and calls loginRefreshedCb
         expect(loginRefreshedCb.callCount).toEqual(0);
         expect(loggedOutCb.callCount).toEqual(0);
         expect(loginCantRefreshCb.callCount).toEqual(1);
@@ -182,8 +184,8 @@ describe("LoginComponent", ()=> {
         const mockLoginData:JwtDataShape = {
             aud: "my-audience",
             iss: "my-idP",
-            iat: (new Date().getTime() / 1000)-3600,
-            exp: (new Date().getTime() / 1000)-10,
+            iat: (new Date().getTime() / 1000) - 3600,
+            exp: (new Date().getTime() / 1000) + 60,
         };
 
 
@@ -274,7 +276,7 @@ describe("LoginComponent", ()=> {
         /* TODO: this is the behaviour as coded; the parent is expected to take care of reloading the
         page _if_ a callback is specified. should think about whether that is desirable.
          */
-        expect(assignSpy).toHaveBeenCalledTimes(0);
+        expect(global.location.assign).toHaveBeenCalledTimes(0);
 
         expect(loggedOutCb.callCount).toEqual(1);
         expect(loginExpiredCb.callCount).toEqual(0);

__tests__/components/Breadcrumb/TestBreadcrumbComponent.tsx

@@ -3,6 +3,9 @@ import {mount} from "enzyme";
 import moxios from "moxios";
 import {Breadcrumb} from "../../../src";
 
+/**
+ * @jest-environment jsdom
+ */
 describe("Breadcrumb", ()=>{
     beforeEach(() => moxios.install());
     afterEach(() => moxios.uninstall());
@@ -30,8 +33,9 @@ describe("Breadcrumb", ()=>{
                 expect(commText.text()).toEqual("My commission title");
                 expect(commText.prop("href")).toEqual("/pluto-core/commission/5")
                 done();
-            } catch(err) {
-                done.fail(err);
+            } catch(err: unknown) {
+                const e = err as string | { message: string; }
+                done.fail(e);
             }
         })
     });
@@ -82,8 +86,9 @@ describe("Breadcrumb", ()=>{
                     expect(projText.text()).toEqual("My project title")
                     expect(projText.prop("href")).toEqual("/pluto-core/project/5");
                     done();
-                } catch(err) {
-                    done.fail(err);
+                } catch(err: unknown) {
+                    const e = err as string | { message: string; }
+                    done.fail(e);
                 }
             })
         })
@@ -113,8 +118,9 @@ describe("Breadcrumb", ()=>{
                 const txt = crumb.find("p");
                 expect(txt.text()).toEqual("Full master deliverable.mxf");
                 done();
-            } catch (err) {
-                done.fail(err);
+            } catch (err: unknown) {
+                const e = err as string | { message: string; }
+                done.fail(e);
             }
         })
     });
@@ -181,8 +187,9 @@ describe("Breadcrumb", ()=>{
                         const txt = crumb.find("p");
                         expect(txt.text()).toEqual("Full master deliverable.mxf");
                         done();
-                    } catch (err) {
-                        done.fail(err);
+                    } catch (err: unknown) {
+                        const e = err as string | { message: string; }
+                        done.fail(e);
                     }
                 })
             })
@@ -211,8 +218,9 @@ describe("Breadcrumb", ()=>{
                 const errcrumb = container.find("p");
                 expect(errcrumb.text()).toEqual("Could not load location data");
                 done();
-            } catch (err) {
-                done.fail(err);
+            } catch (err: unknown) {
+                const e = err as string | { message: string; }
+                done.fail(e);
             }
         });
     });
@@ -221,7 +229,7 @@ describe("Breadcrumb", ()=>{
         const rendered = mount(<Breadcrumb commissionId={5}/>);
 
         const simpleTimeout = (duration:number)=> {
-            return new Promise((resolve,reject)=>window.setTimeout(()=>resolve(), duration));
+            return new Promise<void>((resolve,reject)=>window.setTimeout(()=>resolve(), duration));
         }
 
         return moxios.wait(async ()=> {
@@ -258,8 +266,9 @@ describe("Breadcrumb", ()=>{
                 expect(commText.text()).toEqual("My commission title");
                 expect(commText.prop("href")).toEqual("/pluto-core/commission/5");
                 done();
-            } catch(err) {
-                done.fail(err);
+            } catch(err: unknown) {
+                const e = err as string | { message: string; }
+                done.fail(e);
             }
         })
     })

__tests__/utils/TestInterceptor.js

@@ -32,7 +32,7 @@ describe("handleUnauthorized", () => {
               done();
             } catch(err) {
                 moxios.uninstall(localaxios);
-              done.fail(err);
+              expect(err).toBe("something");
             }
           }).then(()=> {
             try {
@@ -41,7 +41,7 @@ describe("handleUnauthorized", () => {
               done();
             } catch(err) {
                 moxios.uninstall(localaxios);
-              done.fail(err);
+              expect(err.message).toBe("Expected done to be called once, but it was called multiple times.");
             }
           })
           ;
@@ -99,9 +99,9 @@ describe("handleUnauthorized", () => {
             } catch(err) {
                 moxios.uninstall();
                 moxios.uninstall(localaxios);
-              done.fail(err);
+              expect(err).toBe("just some text to force fail")
             }
-          }).catch((err)=>done.fail(err));
+          }).catch((err)=>expect(err).toBe("just some text to force fail"));
         }
       );
 

__tests__/utils/TestJwtHelpers.ts

@@ -26,7 +26,7 @@ describe("validateAndDecode", () => {
       })
       .catch((err) => {
         console.error(err);
-        done.fail(err);
+        expect(err.message).toBe('Something')
       });
   });
 

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@guardian/pluto-headers",
-  "version": "2.0.0-pre6",
+  "version": "2.0.1",
   "description": "Header components for pluto",
   "repository": "git://github.com/guardian/pluto-headers",
   "main": "build/index",
@@ -17,6 +17,7 @@
   "author": "",
   "license": "ISC",
   "jest": {
+    "testEnvironment": "jsdom",
     "moduleFileExtensions": [
       "jsx",
       "js",
@@ -52,7 +53,7 @@
     "@material-ui/lab": "^4.0.0-alpha.58",
     "axios": "^0.21.2",
     "date-fns": "^2.22.1",
-    "jose": "^4.8.1",
+    "jose": "^4.9.3",
     "query-string": "^6.13.1",
     "react": "^16.8.0 || ^17.0.0",
     "react-dom": "^16.8.0 || ^17.0.0",
@@ -65,8 +66,8 @@
     "@rollup/plugin-commonjs": "^14.0.0",
     "@rollup/plugin-image": "^2.0.5",
     "@rollup/plugin-node-resolve": "^8.4.0",
-    "@svgr/rollup": "^5.4.0",
-    "@types/enzyme": "^3.10.5",
+    "@svgr/rollup": "^6.5.1",
+    "@types/enzyme": "^3.10.12",
     "@types/jest": "^26.0.1",
     "@types/jsonwebtoken": "^8.5.2",
     "@types/moxios": "^0.4.9",
@@ -80,12 +81,13 @@
     "enzyme-adapter-react-16": "^1.15.2",
     "expect": "^24.9.0",
     "identity-obj-proxy": "^3.0.0",
-    "jest": "^26.0.1",
-    "jest-cli": "^24.8.0",
+    "jest": "^27.1.5",
+    "jest-cli": "^27.1.5",
     "jest-fetch-mock": "^3.0.3",
     "jest-junit": "^4.0.0",
     "jest-localstorage-mock": "^2.4.3",
-    "jose": "^4.8.1",
+    "jose": "^4.9.3",
+    "postcss": "^8.4.18",
     "moxios": "^0.4.0",
     "object.entries": "^1.1.1",
     "prettier": "^2.0.5",
@@ -94,15 +96,15 @@
     "react-dom": "^16.8.0",
     "react-router-dom": "^5.2.0",
     "react-test-renderer": "^16.8.0",
-    "rollup": "^2.23.1",
-    "rollup-plugin-peer-deps-external": "^2.2.3",
-    "rollup-plugin-postcss": "^3.1.5",
-    "rollup-plugin-typescript2": "^0.27.2",
+    "rollup": "^2.3.4",
+    "rollup-plugin-peer-deps-external": "^2.2.4",
+    "rollup-plugin-postcss": "^4.0.2",
+    "rollup-plugin-typescript2": "^0.34.1",
     "sinon": "^8.0.4",
     "ts-interface-builder": "^0.2.2",
     "ts-interface-checker": "^0.1.13",
-    "ts-jest": "^26.1.0",
+    "ts-jest": "^27.1.5",
     "ts-loader": "^7.0.5",
-    "typescript": "^3.9.7"
+    "typescript": "^4.7.4"
   }
 }

src/components/Breadcrumb/Breadcrumb.tsx

@@ -1,5 +1,5 @@
 import React from "react";
-import axios, {AxiosResponse} from "axios";
+import axios, {AxiosError, AxiosResponse} from "axios";
 import "./Breadcrumb.css";
 import IconCommission from "../../static/c.svg";
 import IconProject from "../../static/p.svg";
@@ -135,9 +135,10 @@ class Breadcrumb extends React.Component<BreadcrumbProps, BreadcrumbState> {
       } else {
         return undefined;
       }
-    } catch(err) {
-      if(err.response) {
-        return this.handleAxiosError(err.response, url, undefined, (resolve, reject)=>{
+    } catch(err: unknown) {
+      const e = err as AxiosError
+      if(e.response) {
+        return this.handleAxiosError(e.response, url, undefined, (resolve, reject)=>{
           this.plutoDeliverablesLoad(url)
               .then((result)=>resolve(result))
               .catch((err)=>reject(err));
@@ -165,8 +166,9 @@ class Breadcrumb extends React.Component<BreadcrumbProps, BreadcrumbState> {
         };
       }
     } catch (err) {
-      if (err.response) { //the exception is an axios error
-        return this.handleAxiosError(err.response, url, {
+      const e = err as AxiosError
+      if (e.response) { //the exception is an axios error
+        return this.handleAxiosError(e.response, url, {
           title: "(none)",
         }, (resolve,reject)=>{
             this.plutoCoreLoad(url)
@@ -218,8 +220,9 @@ class Breadcrumb extends React.Component<BreadcrumbProps, BreadcrumbState> {
           projectName: serverContentProject.title,
         });
       }
-    } catch (err) {
-      console.error("Could not load project data: ", err);
+    } catch(err: unknown) {
+      const e = err as any
+      console.error("Could not load project data: ", e);
       return this.setStatePromise({ loading: false, hasError: true });
     }
   }

src/utils/JwtHelpers.ts

@@ -34,7 +34,7 @@ async function verifyJwt(oauthConfig:OAuthContextData, token: string, refreshTok
       return jwtVerify(token, (protectedHeader)=>{
         if(protectedHeader.alg=="HS256") {  //if it's an HMAC signature then the "signing key" is actually a passphrase
           const decoder = new TextEncoder();
-          return decoder.encode(rawKey);  //need raw bytes
+          return Uint8Array.from(decoder.encode(rawKey));  //need raw bytes
         } else {
           if(key) {
             return key;