Update tests to ensure access token is correctly passed

src/App.test.jsx

@@ -34,7 +34,7 @@ describe("authentication request", () => {
 
 describe("authentication return", () => {
   beforeAll(() => {
-    window.location = { hash: "#access_token=TEST_TOKEN" }
+    window.location = { hash: "#accessToken=TEST_ACCESS_TOKEN" }
   })
 
   test("renders playlist component on return from Spotify with auth token", () => {

src/App.tsx

@@ -18,8 +18,8 @@ function App() {
       <p>Oops, Exportify has encountered a <a target="_blank" rel="noreferrer" href="https://developer.spotify.com/web-api/user-guide/#rate-limiting">rate limiting</a> error while using the Spotify API. This might be because of the number of users currently exporting playlists, or perhaps because you have too many playlists to export all at once. Try <a target="_blank" rel="noreferrer" href="https://github.com/watsonbox/exportify/issues/6#issuecomment-110793132">creating your own</a> Spotify application. If that doesn't work, please add a comment to <a target="_blank" rel="noreferrer" href="https://github.com/watsonbox/exportify/issues/6">this issue</a> where possible resolutions are being discussed.</p>
       <p style={{ marginTop: "50px" }}>It should still be possible to export individual playlists, particularly when using your own Spotify application.</p>
     </div>
-  } else if (key.has('access_token')) {
-    view = <PlaylistTable accessToken={key.get('access_token')} />
+  } else if (key.has('accessToken')) {
+    view = <PlaylistTable accessToken={key.get('accessToken')} />
   } else {
     view = <Login />
   }

src/components/PlaylistTable.test.jsx

@@ -27,7 +27,7 @@ afterEach(() => {
 
 // Use a snapshot test to ensure exact component rendering
 test("playlist loading", async () => {
-  const component = renderer.create(<PlaylistTable />)
+  const component = renderer.create(<PlaylistTable accessToken="TEST_ACCESS_TOKEN" />)
   const instance = component.getInstance()
 
   await waitFor(() => {
@@ -42,7 +42,7 @@ describe("single playlist exporting", () => {
     const saveAsMock = jest.spyOn(FileSaver, "saveAs")
     saveAsMock.mockImplementation(jest.fn())
 
-    render(<PlaylistTable />);
+    render(<PlaylistTable accessToken="TEST_ACCESS_TOKEN" />);
 
     await waitFor(() => {
       expect(screen.getByText(/Export All/)).toBeInTheDocument()
@@ -76,7 +76,7 @@ describe("single playlist exporting", () => {
     const saveAsMock = jest.spyOn(FileSaver, "saveAs")
     saveAsMock.mockImplementation(jest.fn())
 
-    render(<PlaylistTable />);
+    render(<PlaylistTable accessToken="TEST_ACCESS_TOKEN" />);
 
     await waitFor(() => {
       expect(screen.getByText(/Export All/)).toBeInTheDocument()
@@ -112,7 +112,7 @@ test("exporting of all playlist", async () => {
   const jsZipGenerateAsync = jest.spyOn(JSZip.prototype, 'generateAsync')
   jsZipGenerateAsync.mockResolvedValue("zip_content")
 
-  render(<PlaylistTable />);
+  render(<PlaylistTable accessToken="TEST_ACCESS_TOKEN" />);
 
   await waitFor(() => {
     expect(screen.getByText(/Export All/)).toBeInTheDocument()

src/mocks/handlers.jsx

@@ -2,6 +2,10 @@ import { rest } from 'msw'
 
 export const handlers = [
   rest.get('https://api.spotify.com/v1/me', (req, res, ctx) => {
+    if (req.headers.get("Authorization") !== "Bearer TEST_ACCESS_TOKEN") {
+      return res(ctx.status(401), ctx.json({ message: 'Not authorized' }))
+    }
+
     return res(ctx.json(
       {
         "display_name" : "watsonbox",
@@ -22,6 +26,10 @@ export const handlers = [
   }),
 
   rest.get('https://api.spotify.com/v1/users/watsonbox/tracks', (req, res, ctx) => {
+    if (req.headers.get("Authorization") !== "Bearer TEST_ACCESS_TOKEN") {
+      return res(ctx.status(401), ctx.json({ message: 'Not authorized' }))
+    }
+
     return res(ctx.json(
       {
         "href" : "https://api.spotify.com/v1/me/tracks?offset=0&limit=20",
@@ -108,6 +116,10 @@ export const handlers = [
 
   // FIXME: Duplication of data
   rest.get('https://api.spotify.com/v1/me/tracks', (req, res, ctx) => {
+    if (req.headers.get("Authorization") !== "Bearer TEST_ACCESS_TOKEN") {
+      return res(ctx.status(401), ctx.json({ message: 'Not authorized' }))
+    }
+
     return res(ctx.json(
       {
         "href" : "https://api.spotify.com/v1/me/tracks?offset=0&limit=20",
@@ -193,6 +205,10 @@ export const handlers = [
   }),
 
   rest.get('https://api.spotify.com/v1/users/watsonbox/playlists', (req, res, ctx) => {
+    if (req.headers.get("Authorization") !== "Bearer TEST_ACCESS_TOKEN") {
+      return res(ctx.status(401), ctx.json({ message: 'Not authorized' }))
+    }
+
     return res(ctx.json(
       {
         "href" : "https://api.spotify.com/v1/users/watsonbox/playlists?offset=0&limit=20",
@@ -240,6 +256,10 @@ export const handlers = [
   }),
 
   rest.get('https://api.spotify.com/v1/playlists/4XOGDpHMrVoH33uJEwHWU5/tracks?offset=0&limit=10', (req, res, ctx) => {
+    if (req.headers.get("Authorization") !== "Bearer TEST_ACCESS_TOKEN") {
+      return res(ctx.status(401), ctx.json({ message: 'Not authorized' }))
+    }
+
     return res(ctx.json(
       {
         "href" : "https://api.spotify.com/v1/playlists/4XOGDpHMrVoH33uJEwHWU5/tracks?offset=0&limit=100",
@@ -430,6 +450,10 @@ export const handlers = [
 
 export const nullTrackHandlers = [
   rest.get('https://api.spotify.com/v1/playlists/4XOGDpHMrVoH33uJEwHWU5/tracks?offset=0&limit=10', (req, res, ctx) => {
+    if (req.headers.get("Authorization") !== "Bearer TEST_ACCESS_TOKEN") {
+      return res(ctx.status(401), ctx.json({ message: 'Not authorized' }))
+    }
+
     return res(ctx.json(
       {
         "href" : "https://api.spotify.com/v1/playlists/4XOGDpHMrVoH33uJEwHWU5/tracks?offset=0&limit=100",