diff --git a/package.json b/package.json index 2f581c0af..bd74717bf 100644 --- a/package.json +++ b/package.json @@ -34,7 +34,6 @@ "express-session": "^1.17.3", "express-sslify": "^1.2.0", "express-ws": "^5.0.2", - "fbjs": "^3.0.4", "fetch-mock": "^9.11.0", "flip-toolkit": "^7.1.0", "google-map-react": "^2.2.0", @@ -93,7 +92,6 @@ "@types/express-session": "^1.17.6", "@types/express-sslify": "^1.2.2", "@types/express-ws": "^3.0.1", - "@types/fbjs": "^3.0.4", "@types/google-map-react": "^2.1.7", "@types/google.analytics": "^0.0.42", "@types/google.maps": "^3.52.1", diff --git a/src/actions/flash.ts b/src/actions/flash.ts index e62634053..4134eb04c 100644 --- a/src/actions/flash.ts +++ b/src/actions/flash.ts @@ -1,5 +1,8 @@ -import crypto from "crypto"; +import nodeCrypto from "crypto"; import { Action } from "../interfaces"; +import canUseDOM from "../helpers/canUseDOM"; + +const crypto = canUseDOM ? window.crypto : nodeCrypto; export function flashError(message: string): Action { return { diff --git a/src/actions/users.ts b/src/actions/users.ts index c4f9fe6fa..aa3c56f88 100644 --- a/src/actions/users.ts +++ b/src/actions/users.ts @@ -1,6 +1,6 @@ import { ThunkAction } from "@reduxjs/toolkit"; -import { canUseDOM } from "fbjs/lib/ExecutionEnvironment"; import { credentials, jsonHeaders, processResponse } from "../core/ApiClient"; +import canUseDOM from "../helpers/canUseDOM"; import { Action, RoleType, State, Team, User } from "../interfaces"; import { getCurrentUser } from "../selectors/user"; diff --git a/src/components/Layout/Layout.tsx b/src/components/Layout/Layout.tsx index 8700afb05..7904e00f3 100644 --- a/src/components/Layout/Layout.tsx +++ b/src/components/Layout/Layout.tsx @@ -9,16 +9,17 @@ import React, { Component, ReactNode } from "react"; import PropTypes from "prop-types"; -import { canUseDOM } from "fbjs/lib/ExecutionEnvironment"; -import emptyFunction from "fbjs/lib/emptyFunction"; +import { InsertCSS } from "isomorphic-style-loader/StyleContext"; +// eslint-disable-next-line css-modules/no-unused-class, no-unused-vars +import globalCss from "../../styles/globalCss.scss"; +import canUseDOM from "../../helpers/canUseDOM"; import HeaderContainer from "../Header/HeaderContainer"; import FooterContainer from "../Footer/FooterContainer"; import NotificationListContainer from "../NotificationList/NotificationListContainer"; import ConfirmModalContainer from "../ConfirmModal/ConfirmModalContainer"; import s from "./Layout.scss"; -// eslint-disable-next-line css-modules/no-unused-class, no-unused-vars -import globalCss from "../../styles/globalCss.scss"; -import { InsertCSS } from "isomorphic-style-loader/StyleContext"; + +const emptyFunction = () => undefined; export interface LayoutProps { children: ReactNode; diff --git a/src/components/RestaurantAddForm/RestaurantAddForm.tsx b/src/components/RestaurantAddForm/RestaurantAddForm.tsx index 2d026e680..197f62742 100644 --- a/src/components/RestaurantAddForm/RestaurantAddForm.tsx +++ b/src/components/RestaurantAddForm/RestaurantAddForm.tsx @@ -2,8 +2,8 @@ import React, { Component, RefObject, Suspense, createRef, lazy } from "react"; import GeosuggestClass, { GeosuggestProps, Suggest } from "react-geosuggest"; -import { canUseDOM } from "fbjs/lib/ExecutionEnvironment"; import withStyles from "isomorphic-style-loader/withStyles"; +import canUseDOM from "../../helpers/canUseDOM"; import { LatLng } from "../../interfaces"; import GoogleMapsLoaderContext, { IGoogleMapsLoaderContext, diff --git a/src/components/RestaurantMarker/RestaurantMarker.tsx b/src/components/RestaurantMarker/RestaurantMarker.tsx index 22db95835..6d2e8106c 100644 --- a/src/components/RestaurantMarker/RestaurantMarker.tsx +++ b/src/components/RestaurantMarker/RestaurantMarker.tsx @@ -1,6 +1,6 @@ import React from "react"; -import { canUseDOM } from "fbjs/lib/ExecutionEnvironment"; import withStyles from "isomorphic-style-loader/withStyles"; +import canUseDOM from "../../helpers/canUseDOM"; import { AppContext, Restaurant } from "../../interfaces"; import App from "../App"; import RestaurantContainer from "../Restaurant/RestaurantContainer"; diff --git a/src/components/TeamGeosuggest/TeamGeosuggest.tsx b/src/components/TeamGeosuggest/TeamGeosuggest.tsx index 816a83a0c..e877ec4bc 100644 --- a/src/components/TeamGeosuggest/TeamGeosuggest.tsx +++ b/src/components/TeamGeosuggest/TeamGeosuggest.tsx @@ -1,6 +1,6 @@ import React, { Component, Suspense, lazy } from "react"; import { Suggest } from "react-geosuggest"; -import { canUseDOM } from "fbjs/lib/ExecutionEnvironment"; +import canUseDOM from "../../helpers/canUseDOM"; import { LatLng } from "../../interfaces"; import GoogleMapsLoaderContext, { IGoogleMapsLoaderContext, diff --git a/src/helpers/canUseDOM.ts b/src/helpers/canUseDOM.ts new file mode 100644 index 000000000..05df21497 --- /dev/null +++ b/src/helpers/canUseDOM.ts @@ -0,0 +1,5 @@ +export default !!( + typeof window !== "undefined" && + window.document && + window.document.createElement +); diff --git a/src/reducerMaps/notifications.ts b/src/reducerMaps/notifications.ts index d8274eed8..bc26a78dc 100644 --- a/src/reducerMaps/notifications.ts +++ b/src/reducerMaps/notifications.ts @@ -1,5 +1,8 @@ -import crypto from "crypto"; +import nodeCrypto from "crypto"; import { Notification, Reducer } from "../interfaces"; +import canUseDOM from "../helpers/canUseDOM"; + +const crypto = canUseDOM ? window.crypto : nodeCrypto; const notifications: Reducer<"notifications"> = (state, action) => { switch (action.type) { @@ -146,6 +149,8 @@ const notifications: Reducer<"notifications"> = (state, action) => { case "EXPIRE_NOTIFICATION": { return state.filter((n) => n.id !== action.id); } + default: + break; } return state; }; diff --git a/src/routes/team/home/Home.test.tsx b/src/routes/team/home/Home.test.tsx index aa790b070..e2985fa4c 100644 --- a/src/routes/team/home/Home.test.tsx +++ b/src/routes/team/home/Home.test.tsx @@ -8,6 +8,7 @@ import proxyquire from "proxyquire"; import { render, screen } from "../../../../test/test-utils"; import { HomeProps } from "./Home"; import { User } from "../../../interfaces"; +import mockEsmodule from "test/mockEsmodule"; const proxy = proxyquire.noCallThru(); @@ -33,7 +34,9 @@ const TagFilterFormContainer = () => ( // eslint-disable-next-line no-underscore-dangle const Home = proxy("./Home", { - "fbjs/lib/ExecutionEnvironment": { canUseDOM: false }, + "../../../helpers/canUseDOM": mockEsmodule({ + default: false, + }), "../../../components/RestaurantAddForm/RestaurantAddFormContainer": RestaurantAddFormContainer, "../../../components/Footer/FooterContainer": FooterContainer, diff --git a/src/routes/team/home/Home.tsx b/src/routes/team/home/Home.tsx index 9ea6808a8..d1bf0e976 100644 --- a/src/routes/team/home/Home.tsx +++ b/src/routes/team/home/Home.tsx @@ -1,5 +1,4 @@ import React, { Component } from "react"; -import { canUseDOM } from "fbjs/lib/ExecutionEnvironment"; import RobustWebSocket from "robust-websocket"; import withStyles from "isomorphic-style-loader/withStyles"; import FooterContainer from "../../../components/Footer/FooterContainer"; @@ -9,6 +8,7 @@ import RestaurantMapContainer from "../../../components/RestaurantMap/Restaurant import RestaurantListContainer from "../../../components/RestaurantList/RestaurantListContainer"; import RestaurantAddFormContainer from "../../../components/RestaurantAddForm/RestaurantAddFormContainer"; import TagFilterFormContainer from "../../../components/TagFilterForm/TagFilterFormContainer"; +import canUseDOM from "../../../helpers/canUseDOM"; import { User } from "../../../interfaces"; import s from "./Home.scss"; import GoogleMapsLoaderContext, { diff --git a/src/styles/globalCss.scss b/src/styles/globalCss.scss index 70e285a3c..fd7d05054 100644 --- a/src/styles/globalCss.scss +++ b/src/styles/globalCss.scss @@ -15,8 +15,9 @@ @import "~bootstrap/scss/tables"; @import "~bootstrap/scss/forms"; @import "~bootstrap/scss/buttons"; +@import "~bootstrap/scss/dropdown"; @import "~bootstrap/scss/nav"; -@import "~bootstrap/scss/list-group"; +@import "~bootstrap/scss/bootstrap"; @import "~bootstrap/scss/helpers/visually-hidden"; @import "~bootstrap/scss/utilities/api"; diff --git a/test/setup.ts b/test/setup.ts index 0eae4c723..1125a5e35 100644 --- a/test/setup.ts +++ b/test/setup.ts @@ -9,12 +9,10 @@ /* Configure Mocha test runner, see package.json/scripts/test */ -require("global-jsdom/register"); - -// eslint-disable-next-line @typescript-eslint/no-var-requires -const { use } = require("chai"); -// eslint-disable-next-line @typescript-eslint/no-var-requires -const chaiJSDOM = require("chai-jsdom"); +import "global-jsdom/register"; +import { use } from "chai"; +import chaiJSDOM from "chai-jsdom"; +import nodeCrypto from "crypto"; use(chaiJSDOM); @@ -24,6 +22,8 @@ function noop() { return null; } +window.crypto.randomUUID = nodeCrypto.randomUUID; + require.extensions[".css"] = noop; require.extensions[".scss"] = noop; require.extensions[".md"] = noop; diff --git a/yarn.lock b/yarn.lock index e78deeca7..8f144e7c3 100644 --- a/yarn.lock +++ b/yarn.lock @@ -2299,15 +2299,6 @@ __metadata: languageName: node linkType: hard -"@types/fbjs@npm:^3.0.4": - version: 3.0.4 - resolution: "@types/fbjs@npm:3.0.4" - dependencies: - "@types/jsdom": "*" - checksum: c251ab9561f9d3b127d8669f16130a205dfbba5b3ece7ac3da9d8fe202f4e78bc32afc59e0ee4a03aabb0b0a149c821a579ef1db59ee96dd9756734dbbb91511 - languageName: node - linkType: hard - "@types/google-map-react@npm:^2.1.7": version: 2.1.7 resolution: "@types/google-map-react@npm:2.1.7" @@ -2383,17 +2374,6 @@ __metadata: languageName: node linkType: hard -"@types/jsdom@npm:*": - version: 21.1.1 - resolution: "@types/jsdom@npm:21.1.1" - dependencies: - "@types/node": "*" - "@types/tough-cookie": "*" - parse5: ^7.0.0 - checksum: 7450d6e23aa31b837a1682f0e59b06838aacca85c9d030035f40e21d559169c773aee5cee9244f23c3004b78f7064f0c540ceb808d2f187deb3140f2b0449dee - languageName: node - linkType: hard - "@types/json-schema@npm:*, @types/json-schema@npm:^7.0.4, @types/json-schema@npm:^7.0.5, @types/json-schema@npm:^7.0.8, @types/json-schema@npm:^7.0.9": version: 7.0.11 resolution: "@types/json-schema@npm:7.0.11" @@ -2782,13 +2762,6 @@ __metadata: languageName: node linkType: hard -"@types/tough-cookie@npm:*": - version: 4.0.2 - resolution: "@types/tough-cookie@npm:4.0.2" - checksum: e055556ffdaa39ad85ede0af192c93f93f986f4bd9e9426efdc2948e3e2632db3a4a584d4937dbf6d7620527419bc99e6182d3daf2b08685e710f2eda5291905 - languageName: node - linkType: hard - "@types/trusted-types@npm:^2.0.2": version: 2.0.2 resolution: "@types/trusted-types@npm:2.0.2" @@ -3585,7 +3558,7 @@ __metadata: languageName: node linkType: hard -"asap@npm:^2.0.0, asap@npm:~2.0.3": +"asap@npm:^2.0.0": version: 2.0.6 resolution: "asap@npm:2.0.6" checksum: b296c92c4b969e973260e47523207cd5769abd27c245a68c26dc7a0fe8053c55bb04360237cb51cab1df52be939da77150ace99ad331fb7fb13b3423ed73ff3d @@ -4853,15 +4826,6 @@ __metadata: languageName: node linkType: hard -"cross-fetch@npm:^3.1.5": - version: 3.1.5 - resolution: "cross-fetch@npm:3.1.5" - dependencies: - node-fetch: 2.6.7 - checksum: f6b8c6ee3ef993ace6277fd789c71b6acf1b504fd5f5c7128df4ef2f125a429e29cd62dc8c127523f04a5f2fa4771ed80e3f3d9695617f441425045f505cf3bb - languageName: node - linkType: hard - "cross-spawn@npm:^5.1.0": version: 5.1.0 resolution: "cross-spawn@npm:5.1.0" @@ -6575,28 +6539,6 @@ __metadata: languageName: node linkType: hard -"fbjs-css-vars@npm:^1.0.0": - version: 1.0.2 - resolution: "fbjs-css-vars@npm:1.0.2" - checksum: 72baf6d22c45b75109118b4daecb6c8016d4c83c8c0f23f683f22e9d7c21f32fff6201d288df46eb561e3c7d4bb4489b8ad140b7f56444c453ba407e8bd28511 - languageName: node - linkType: hard - -"fbjs@npm:^3.0.4": - version: 3.0.4 - resolution: "fbjs@npm:3.0.4" - dependencies: - cross-fetch: ^3.1.5 - fbjs-css-vars: ^1.0.0 - loose-envify: ^1.0.0 - object-assign: ^4.1.0 - promise: ^7.1.1 - setimmediate: ^1.0.5 - ua-parser-js: ^0.7.30 - checksum: 8b23a3550fcda8a9109fca9475a3416590c18bb6825ea884192864ed686f67fcd618e308a140c9e5444fbd0168732e1ff3c092ba3d0c0ae1768969f32ba280c7 - languageName: node - linkType: hard - "fd-slicer@npm:~1.1.0": version: 1.1.0 resolution: "fd-slicer@npm:1.1.0" @@ -9314,7 +9256,6 @@ __metadata: "@types/express-session": ^1.17.6 "@types/express-sslify": ^1.2.2 "@types/express-ws": ^3.0.1 - "@types/fbjs": ^3.0.4 "@types/google-map-react": ^2.1.7 "@types/google.analytics": ^0.0.42 "@types/google.maps": ^3.52.1 @@ -9374,7 +9315,6 @@ __metadata: express-session: ^1.17.3 express-sslify: ^1.2.0 express-ws: ^5.0.2 - fbjs: ^3.0.4 fetch-mock: ^9.11.0 file-loader: ^6.2.0 flip-toolkit: ^7.1.0 @@ -10100,20 +10040,6 @@ __metadata: languageName: node linkType: hard -"node-fetch@npm:2.6.7": - version: 2.6.7 - resolution: "node-fetch@npm:2.6.7" - dependencies: - whatwg-url: ^5.0.0 - peerDependencies: - encoding: ^0.1.0 - peerDependenciesMeta: - encoding: - optional: true - checksum: 8d816ffd1ee22cab8301c7756ef04f3437f18dace86a1dae22cf81db8ef29c0bf6655f3215cb0cdb22b420b6fe141e64b26905e7f33f9377a7fa59135ea3e10b - languageName: node - linkType: hard - "node-fetch@npm:^2.6.7": version: 2.6.9 resolution: "node-fetch@npm:2.6.9" @@ -10380,7 +10306,7 @@ __metadata: languageName: node linkType: hard -"object-assign@npm:^4, object-assign@npm:^4.1.0, object-assign@npm:^4.1.1": +"object-assign@npm:^4, object-assign@npm:^4.1.1": version: 4.1.1 resolution: "object-assign@npm:4.1.1" checksum: fcc6e4ea8c7fe48abfbb552578b1c53e0d194086e2e6bbbf59e0a536381a292f39943c6e9628af05b5528aa5e3318bb30d6b2e53cadaf5b8fe9e12c4b69af23f @@ -10701,7 +10627,7 @@ __metadata: languageName: node linkType: hard -"parse5@npm:^7.0.0, parse5@npm:^7.1.2": +"parse5@npm:^7.1.2": version: 7.1.2 resolution: "parse5@npm:7.1.2" dependencies: @@ -11319,15 +11245,6 @@ __metadata: languageName: node linkType: hard -"promise@npm:^7.1.1": - version: 7.3.1 - resolution: "promise@npm:7.3.1" - dependencies: - asap: ~2.0.3 - checksum: 475bb069130179fbd27ed2ab45f26d8862376a137a57314cf53310bdd85cc986a826fd585829be97ebc0aaf10e9d8e68be1bfe5a4a0364144b1f9eedfa940cf1 - languageName: node - linkType: hard - "prompts@npm:^2.4.2": version: 2.4.2 resolution: "prompts@npm:2.4.2" @@ -12699,13 +12616,6 @@ __metadata: languageName: node linkType: hard -"setimmediate@npm:^1.0.5": - version: 1.0.5 - resolution: "setimmediate@npm:1.0.5" - checksum: c9a6f2c5b51a2dabdc0247db9c46460152ffc62ee139f3157440bd48e7c59425093f42719ac1d7931f054f153e2d26cf37dfeb8da17a794a58198a2705e527fd - languageName: node - linkType: hard - "setprototypeof@npm:1.1.0": version: 1.1.0 resolution: "setprototypeof@npm:1.1.0" @@ -14158,13 +14068,6 @@ __metadata: languageName: node linkType: hard -"ua-parser-js@npm:^0.7.30": - version: 0.7.33 - resolution: "ua-parser-js@npm:0.7.33" - checksum: 1510e9ec26fcaf0d8c6ae8f1078a8230e8816f083e1b5f453ea19d06b8ef2b8a596601c92148fd41899e8b3e5f83fa69c42332bd5729b931a721040339831696 - languageName: node - linkType: hard - "ua-parser-js@npm:^1.0.33": version: 1.0.35 resolution: "ua-parser-js@npm:1.0.35"