Upgrade Jest to v27.5, remove jest-transform-stub, add a custom transformer

jest.config.js

@@ -1,3 +1,5 @@
+const ASSET_EXTS = 'css|styl|less|sass|scss|png|jpg|svg|ogg|oga|mp3|ttf|woff|woff2';
+
 module.exports = {
   'testPathIgnorePatterns': [
     '<rootDir>/node_modules/',
@@ -32,11 +34,12 @@ module.exports = {
   ],
   'testMatch': ['**/*/__tests__/**/?(*.|*-)+(test).(ts|js)?(x)'],
   'testEnvironment': 'jsdom',
-  'moduleNameMapper': {
-    '^.+.(css|styl|less|sass|scss|png|jpg|svg|ttf|woff|woff2)$': 'jest-transform-stub',
-  },
+  'transformIgnorePatterns': [
+    // Ignore node_modules, except static assets
+    `/node_modules/(?!.+\\.(${ASSET_EXTS}))`,
+  ],
   'transform': {
     '\\.[jt]sx?$': 'babel-jest',
-    '.+\\.(css|styl|less|sass|scss|png|jpg|svg|ttf|woff|woff2)$': 'jest-transform-stub',
+    [`.+\\.(${ASSET_EXTS})$`]: '<rootDir>/jest/assetTransformer.js',
   },
 };

jest/assetTransformer.js

@@ -0,0 +1,10 @@
+const path = require('path');
+
+// Custom Jest asset transformer
+// https://jestjs.io/docs/code-transformation#writing-custom-transformers
+// Tries to do basically what Webpack does
+module.exports = {
+  process(src, filename, config, options) {
+    return `module.exports = "https://soapbox.test/assets/${path.basename(filename)}";`;
+  },
+};

package.json

@@ -125,7 +125,6 @@
     "intl-messageformat-parser": "^6.0.0",
     "intl-pluralrules": "^1.3.0",
     "is-nan": "^1.2.1",
-    "jest-transform-stub": "^2.0.0",
     "jsdoc": "~3.6.7",
     "line-awesome": "^1.3.0",
     "localforage": "^1.10.0",
@@ -208,7 +207,7 @@
     "eslint-plugin-react": "^7.25.1",
     "eslint-plugin-react-hooks": "^4.2.0",
     "husky": "^7.0.2",
-    "jest": "^27.1.0",
+    "jest": "^27.5.1",
     "lint-staged": ">=10",
     "raf": "^3.4.1",
     "react-intl-translations-manager": "^5.0.3",