cli: added jest transform for static assets

packages/cli/config/jest.js

@@ -38,11 +38,16 @@ async function getConfig() {
     transform: {
       '\\.esm\\.js$': require.resolve('jest-esm-transformer'),
       '\\.(js|jsx|ts|tsx)': require.resolve('ts-jest'),
+      '\\.(bmp|gif|jpe|png|frag|xml|svg)': require.resolve(
+        './jestFileTransform.js',
+      ),
     },
 
     // Default behaviour is to not apply transforms for node_modules, but we still want
     // to apply the esm-transformer to .esm.js files, since that's what we use in backstage packages.
-    transformIgnorePatterns: ['/node_modules/(?!.*\\.esm\\.js$)'],
+    transformIgnorePatterns: [
+      '/node_modules/(?!.*\\.(?:esm\\.js|bmp|gif|jpe|png|frag|xml|svg)$)',
+    ],
   };
 
   // Use src/setupTests.ts as the default location for configuring test env

packages/cli/config/jestFileTransform.js

@@ -0,0 +1,42 @@
+/*
+ * Copyright 2020 Spotify AB
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+const path = require('path');
+
+module.exports = {
+  process(src, filename) {
+    const assetFilename = JSON.stringify(path.basename(filename));
+
+    if (filename.match(/\.icon\.svg$/)) {
+      return `const React = require('react');
+      const SvgIcon = require('@material-ui/core/SvgIcon').default;
+      module.exports = {
+        __esModule: true,
+        default: props => React.createElement(SvgIcon, props, {
+          $$typeof: Symbol.for('react.element'),
+          type: 'svg',
+          ref: ref,
+          key: null,
+          props: Object.assign({}, props, {
+            children: ${assetFilename}
+          })
+        })
+      };`;
+    }
+
+    return `module.exports = ${assetFilename};`;
+  },
+};