Merge pull request #223 from gladly-team/kevin/upgrade-deps

Upgrade dependencies

.prettierrc.json

@@ -1,6 +1,5 @@
 {
   "bracketSpacing": true,
-  "jsxBracketSameLine": false,
   "useTabs": false,
   "semi": false,
   "singleQuote": true,

__mocks__/next-firebase-auth/withAuthUserSSR.js

@@ -1,6 +1,7 @@
-const withAuthUserSSR = jest.fn(() => (getServerSidePropsFunc) => (ctx) =>
-  typeof getServerSidePropsFunc === 'function'
-    ? getServerSidePropsFunc(ctx)
-    : undefined
+const withAuthUserSSR = jest.fn(
+  () => (getServerSidePropsFunc) => (ctx) =>
+    typeof getServerSidePropsFunc === 'function'
+      ? getServerSidePropsFunc(ctx)
+      : undefined
 )
 export default withAuthUserSSR

__mocks__/next-firebase-auth/withAuthUserTokenSSR.js

@@ -1,4 +1,4 @@
-const withAuthUserTokenSSR = jest.fn(() => (getServerSidePropsFunc) => (ctx) =>
-  getServerSidePropsFunc(ctx)
+const withAuthUserTokenSSR = jest.fn(
+  () => (getServerSidePropsFunc) => (ctx) => getServerSidePropsFunc(ctx)
 )
 export default withAuthUserTokenSSR

jest.config.js

@@ -14,6 +14,7 @@ module.exports = {
     '^.+\\.module\\.(css|sass|scss)$': 'identity-obj-proxy',
   },
   setupFilesAfterEnv: ['<rootDir>/jest/setupTests.js'],
+  testEnvironment: 'jsdom',
   testPathIgnorePatterns: ['/node_modules/', '/.next/', '/.yalc/', '/.git/'],
   transform: {
     '^.+\\.(js|jsx|ts|tsx)$': '<rootDir>/node_modules/babel-jest',

package.json

@@ -7,7 +7,7 @@
     "dev": "echo \"Use the 'yarn go' command to develop locally.\"",
     "build": "NODE_ENV=test yarn run test && NODE_ENV=production yarn run relay && next build",
     "start": "NODE_ENV=production next start --port 3001",
-    "test": "yarn run relay && yarn run jest --testPathIgnorePatterns=e2e",
+    "test": "yarn run relay && yarn run lint && yarn run jest --testPathIgnorePatterns=e2e",
     "test:e2e": "dotenv-extended --defaults=./.env --path=./.env.local yarn run jest e2e-tests.test.js",
     "test:watch": "yarn run relay && jest --watch",
     "test:coverage": "yarn run test --coverage",
@@ -44,14 +44,14 @@
     "react": "^16.13.1",
     "react-dom": "^16.13.1",
     "react-firebaseui": "^4.1.0",
-    "react-relay": "^10.1.2",
+    "react-relay": "^12.0.0",
     "react-share": "^4.4.0",
     "react-transition-group": "^4.4.1",
-    "relay-runtime": "^10.1.2",
-    "swr": "^0.4.0",
+    "relay-runtime": "^12.0.0",
+    "swr": "^1.0.1",
     "tab-ads": "^1.1.3",
     "tab-cmp": "^0.13.0",
-    "uuid": "^3.3.2"
+    "uuid": "^8.3.2"
   },
   "devDependencies": {
     "@babel/core": "^7.12.10",
@@ -62,39 +62,39 @@
     "@storybook/core-events": "^6.3.0",
     "@storybook/react": "^6.3.6",
     "@storybook/theming": "^6.3.0",
-    "@testing-library/react-hooks": "^4.0.0",
-    "babel-jest": "^26.6.3",
+    "@testing-library/react-hooks": "^7.0.2",
+    "babel-jest": "^26.0.0",
     "babel-loader": "^8.2.2",
     "babel-plugin-module-resolver": "^4.1.0",
-    "babel-plugin-relay": "^10.1.2",
+    "babel-plugin-relay": "^12.0.0",
     "babel-plugin-transform-dynamic-import": "^2.1.0",
     "chromatic": "^5.10.1",
     "enzyme": "^3.11.0",
     "enzyme-adapter-react-16": "^1.15.5",
     "eslint": "^7.17.0",
     "eslint-config-airbnb": "^18.2.1",
-    "eslint-config-prettier": "^7.1.0",
+    "eslint-config-prettier": "^8.3.0",
     "eslint-import-resolver-alias": "^1.1.2",
     "eslint-plugin-import": "^2.22.1",
     "eslint-plugin-jest": "^24.1.3",
     "eslint-plugin-jsx-a11y": "^6.4.1",
-    "eslint-plugin-prettier": "^3.3.1",
+    "eslint-plugin-prettier": "^4.0.0",
     "eslint-plugin-react": "^7.22.0",
     "eslint-plugin-react-hooks": "^4.2.0",
     "graphql": "^15.4.0",
     "identity-obj-proxy": "^3.0.0",
-    "jest": "^26.6.3",
+    "jest": "^26.0.0",
     "jest-next-dynamic": "^1.0.1",
     "mockdate": "^3.0.2",
-    "msw": "^0.33.2",
+    "msw": "^0.35.0",
     "msw-storybook-addon": "^1.2.0",
-    "next-unused": "^0.0.3",
+    "next-unused": "^0.0.6",
     "prettier": "^2.2.1",
     "react-test-renderer": "^16.9.0",
-    "relay-compiler": "^10.1.2",
+    "relay-compiler": "^12.0.0",
     "tab-e2e": "^1.1.0",
     "typescript": "^4.3.0",
-    "vercel": "^21.3.3",
+    "vercel": "^23.1.2",
     "webpack": "^4.0.0"
   },
   "next-unused": {

src/__tests__/e2e/e2e-tests.test.js

@@ -18,8 +18,9 @@ const tests = init({
 })
 
 describe('Tab: acceptance tests', () => {
-  tests.forEach(({ description, test, testTimeout }) =>
-    // eslint-disable-next-line jest/valid-title
+  tests.forEach(({ description, test, testTimeout }) => {
+    // We let the tab-e2e package make assertions.
+    // eslint-disable-next-line jest/valid-title, jest/expect-expect
     it(description, test, testTimeout)
-  )
+  })
 })

src/__tests__/pages/_app.moduleLoad.test.js

@@ -27,28 +27,28 @@ afterEach(() => {
   jest.resetModules()
 })
 
-describe('_app.js: Sentry', () => {
+describe('_app: Sentry', () => {
   it('calls to initialize Sentry', () => {
     expect.assertions(1)
     const initSentry = require('src/utils/initSentry').default
 
     // eslint-disable-next-line no-unused-expressions
-    require('src/pages/_app.js').default
+    require('src/pages/_app').default
     expect(initSentry).toHaveBeenCalled()
   })
 })
 
-describe('_app.js: initializes auth', () => {
+describe('_app: initializes auth', () => {
   it('initializes authentication on module load', () => {
     expect.assertions(1)
     const initAuth = require('src/utils/auth/initAuth').default
     // eslint-disable-next-line no-unused-expressions
-    require('src/pages/_app.js').default
+    require('src/pages/_app').default
     expect(initAuth).toHaveBeenCalledTimes(1)
   })
 })
 
-describe('_app.js: tab-cmp', () => {
+describe('_app: tab-cmp', () => {
   it('initializes the CMP when on the client side', () => {
     expect.assertions(1)
     const { isClientSide } = require('src/utils/ssr')
@@ -57,7 +57,7 @@ describe('_app.js: tab-cmp', () => {
     const initializeCMP = require('src/utils/initializeCMP').default
 
     // eslint-disable-next-line no-unused-expressions
-    require('src/pages/_app.js').default
+    require('src/pages/_app').default
     jest.runAllTimers()
     expect(initializeCMP).toHaveBeenCalled()
   })
@@ -70,18 +70,18 @@ describe('_app.js: tab-cmp', () => {
     const initializeCMP = require('src/utils/initializeCMP').default
 
     // eslint-disable-next-line no-unused-expressions
-    require('src/pages/_app.js').default
+    require('src/pages/_app').default
     jest.runAllTimers()
     expect(initializeCMP).not.toHaveBeenCalled()
   })
 })
 
-describe('_app.js: router overrides', () => {
+describe('_app: router overrides', () => {
   it('sets a callback to the "routeChangeStart" router event', () => {
     expect.assertions(1)
     const Router = require('next/router')
     // eslint-disable-next-line no-unused-expressions
-    require('src/pages/_app.js').default
+    require('src/pages/_app').default
     expect(Router.events.on).toHaveBeenCalledWith(
       'routeChangeStart',
       expect.any(Function)
@@ -93,7 +93,7 @@ describe('_app.js: router overrides', () => {
     const Router = require('next/router')
     const { setWindowLocation } = require('src/utils/navigation')
     // eslint-disable-next-line no-unused-expressions
-    require('src/pages/_app.js').default
+    require('src/pages/_app').default
     const routeChangeStartCallback = Router.events.on.mock.calls[0][1]
     expect(() => {
       routeChangeStartCallback('/newtab/auth/')
@@ -108,7 +108,7 @@ describe('_app.js: router overrides', () => {
     const Router = require('next/router')
     const { setWindowLocation } = require('src/utils/navigation')
     // eslint-disable-next-line no-unused-expressions
-    require('src/pages/_app.js').default
+    require('src/pages/_app').default
     const routeChangeStartCallback = Router.events.on.mock.calls[0][1]
     expect(() => {
       routeChangeStartCallback('/newtab/auth/some/page/here/')
@@ -126,7 +126,7 @@ describe('_app.js: router overrides', () => {
     const Router = require('next/router')
     const { setWindowLocation } = require('src/utils/navigation')
     // eslint-disable-next-line no-unused-expressions
-    require('src/pages/_app.js').default
+    require('src/pages/_app').default
     const routeChangeStartCallback = Router.events.on.mock.calls[0][1]
     expect(() => {
       routeChangeStartCallback('/newtab/account/')

src/__tests__/pages/_app.test.js

@@ -36,7 +36,7 @@ describe('_app.js', () => {
 
   it('renders without error', () => {
     expect.assertions(1)
-    const App = require('src/pages/_app.js').default
+    const App = require('src/pages/_app').default
     const mockProps = getMockProps()
     expect(() => {
       mount(<App {...mockProps} />)
@@ -46,7 +46,7 @@ describe('_app.js', () => {
   it('registers the service worker if process.env.NEXT_PUBLIC_SERVICE_WORKER_ENABLED === "true"', () => {
     expect.assertions(1)
     process.env.NEXT_PUBLIC_SERVICE_WORKER_ENABLED = 'true'
-    const App = require('src/pages/_app.js').default
+    const App = require('src/pages/_app').default
     const mockProps = getMockProps()
     mount(<App {...mockProps} />)
     expect(register).toHaveBeenCalledWith('/newtab/service-worker.js')
@@ -55,7 +55,7 @@ describe('_app.js', () => {
   it('unregisters the service worker if process.env.NEXT_PUBLIC_SERVICE_WORKER_ENABLED === "false"', () => {
     expect.assertions(1)
     process.env.NEXT_PUBLIC_SERVICE_WORKER_ENABLED = 'false'
-    const App = require('src/pages/_app.js').default
+    const App = require('src/pages/_app').default
     const mockProps = getMockProps()
     mount(<App {...mockProps} />)
     expect(unregister).toHaveBeenCalled()
@@ -64,7 +64,7 @@ describe('_app.js', () => {
   it('unregisters the service worker if process.env.NEXT_PUBLIC_SERVICE_WORKER_ENABLED is undefined', () => {
     expect.assertions(1)
     delete process.env.NEXT_PUBLIC_SERVICE_WORKER_ENABLED
-    const App = require('src/pages/_app.js').default
+    const App = require('src/pages/_app').default
     const mockProps = getMockProps()
     mount(<App {...mockProps} />)
     expect(unregister).toHaveBeenCalled()

src/__tests__/pages/_error.test.js

@@ -20,7 +20,7 @@ afterEach(() => {
 describe('_error.js: render', () => {
   it('renders without error', () => {
     expect.assertions(1)
-    const ErrorPage = require('src/pages/_error.js').default
+    const ErrorPage = require('src/pages/_error').default
     const mockProps = getMockProps()
     expect(() => {
       shallow(<ErrorPage {...mockProps} />)
@@ -29,7 +29,7 @@ describe('_error.js: render', () => {
 
   it('returns the ErrorPageComponent', () => {
     expect.assertions(1)
-    const ErrorPage = require('src/pages/_error.js').default
+    const ErrorPage = require('src/pages/_error').default
     const wrapper = shallow(<ErrorPage />)
     expect(wrapper.at(0).type()).toEqual(ErrorPageComponent)
   })
@@ -39,7 +39,7 @@ describe('_error.js: getInitialProps', () => {
   it('returns the status code when called server-side', async () => {
     expect.assertions(1)
     const otherMockErr = new Error('Another error.')
-    const ErrorPage = require('src/pages/_error.js').default
+    const ErrorPage = require('src/pages/_error').default
     const initialProps = await ErrorPage.getInitialProps({
       res: { ...getMockRes(), statusCode: 403 },
       err: otherMockErr,
@@ -54,7 +54,7 @@ describe('_error.js: getInitialProps', () => {
     expect.assertions(1)
     const otherMockErr = new Error('Another error.')
     otherMockErr.statusCode = 500
-    const ErrorPage = require('src/pages/_error.js').default
+    const ErrorPage = require('src/pages/_error').default
     const initialProps = await ErrorPage.getInitialProps({
       res: undefined, // not server-side
       err: otherMockErr,
@@ -67,7 +67,7 @@ describe('_error.js: getInitialProps', () => {
 
   it('returns a 404 status code when called client-side with no error', async () => {
     expect.assertions(1)
-    const ErrorPage = require('src/pages/_error.js').default
+    const ErrorPage = require('src/pages/_error').default
     const initialProps = await ErrorPage.getInitialProps({
       res: undefined, // not server-side
       err: undefined, // no provided error

src/__tests__/pages/account.moduleLoad.test.js

@@ -21,7 +21,7 @@ describe('account.js: HOC', () => {
   it('calls `withAuthUser`, with a render/redirect-if-unauthed strategy', () => {
     expect.assertions(1)
     const { withAuthUser, AuthAction } = require('next-firebase-auth')
-    const AccountPage = require('src/pages/account.js').default
+    const AccountPage = require('src/pages/account').default
     const mockProps = getMockProps()
     shallow(<AccountPage {...mockProps} />)
     expect(withAuthUser).toHaveBeenCalledWith({
@@ -32,7 +32,7 @@ describe('account.js: HOC', () => {
   it('calls `withRelay`', () => {
     expect.assertions(1)
     const withRelay = require('src/utils/pageWrappers/withRelay').default
-    const AccountPage = require('src/pages/account.js').default
+    const AccountPage = require('src/pages/account').default
     const mockProps = getMockProps()
     shallow(<AccountPage {...mockProps} />)
     expect(withRelay).toHaveBeenCalled()
@@ -42,7 +42,7 @@ describe('account.js: HOC', () => {
 describe('account.js: getServerSideProps', () => {
   it('does not define getServerSideProps', () => {
     expect.assertions(1)
-    const { getServerSideProps } = require('src/pages/account.js')
+    const { getServerSideProps } = require('src/pages/account')
     expect(getServerSideProps).toBeUndefined()
   })
 })