RDEV-6144 [Webpack] Remove data-test-id from production builds

ViewGenerator/ViewGenerator.csproj

@@ -7,7 +7,7 @@
     <AssemblyTitle>ViewGenerator</AssemblyTitle>
     <Product>ViewGenerator</Product>
     <Description>Generates .NET View bindings from typescript</Description>
-    <Version>1.1.22</Version>
+    <Version>1.1.41</Version>
     <PackageId>ViewGenerator</PackageId>
     <PackageTags>Library</PackageTags>
 

ViewGenerator/build/ViewGenerator.targets

@@ -124,7 +124,7 @@
 
   <!-- Default stylesheet related target -->
   <Target Name="VG_GenerateDefaultStyleSheet" >
-    <Exec Command="node &quot;$(ViewPackerToolScript)&quot; --config=&quot;$(ViewGeneratorToolsPath)/webpack/webpack_stylesheets.config.js&quot; --mode=$(WP_Mode) --devtool=$(WP_DevTool) --env entryPath='@(DefaultStyleSheet)' --env assemblyName='$(AssemblyName)'" />
+    <Exec Command="node &quot;$(ViewPackerToolScript)&quot; --config=&quot;$(ViewGeneratorToolsPath)/webpack/webpack_stylesheets.config.js&quot; --mode=$(WP_Mode) --devtool=$(WP_DevTool) --env useCache=$(WP_UseCache) --env entryPath='@(DefaultStyleSheet)' --env assemblyName='$(AssemblyName)'" />
   </Target>
 
   <!-- Workers related target -->

ViewGenerator/tools/webpack/Plugins/CommonConfiguration.ts

@@ -100,7 +100,7 @@ let getCommonConfiguration = (cacheName: string, libraryName: string, assemblyNa
             rules: [
                 SassRuleSet,
                 getResourcesRuleSet(assemblyName, pluginsAssembly),
-                getTypeScriptRuleSet(forHotReload)
+                getTypeScriptRuleSet(forHotReload, !cacheName)
             ]
         },
 

ViewGenerator/tools/webpack/Plugins/DataTestIdTransformerPlugin.ts

@@ -0,0 +1,10 @@
+import TypeScript from "typescript";
+import { removeDataTestIdTransformer } from "./Utils";
+
+const dataTestIdTransformer: TypeScript.TransformerFactory<TypeScript.Node> = removeDataTestIdTransformer();
+
+const getCustomTransformers = () => ({ 
+    before: [dataTestIdTransformer]
+});
+
+module.exports = getCustomTransformers;

ViewGenerator/tools/webpack/Plugins/Resources.ts

@@ -19,4 +19,7 @@ export const JsPlaceholder: string = "[name].js";
 export const JsMapPlaceholder: string = "[name].js.map";
 export const IdPlaceholder: string = "[id]";
 export const RuntimePlaceholder: string = "[runtime]";
-export const FullHashPlaceholder: string = "[fullhash]";
+export const FullHashPlaceholder: string = "[fullhash]";
+
+// Attributes
+export const DataTestIdAttributes: string[] = ["data-test-id", "data-testid"];

ViewGenerator/tools/webpack/Plugins/Utils.ts

@@ -1,9 +1,10 @@
 import { outputFileSync } from "fs-extra";
 import { resolve } from "path";
+import TypeScript from 'typescript';
 import { FileDescriptor } from "webpack-manifest-plugin/dist/helpers";
-
 import {
     CssExtension,
+    DataTestIdAttributes,
     EntryExtension,
     JsChunkPlaceholder,
     JsExtension,
@@ -111,4 +112,21 @@ export function getFileName(relativePaths: Dictionary<string>, chunkData: any):
  * */
 export function sanitizeCommandLineParam(parameter: string): string {
     return !parameter ? "" : parameter.replaceAll("'", "");
+}
+
+/*
+ * Removes data-test-id attribute
+ * */
+export function removeDataTestIdTransformer<T extends TypeScript.Node>(): TypeScript.TransformerFactory<T> {
+    return context => {
+        const visit: TypeScript.Visitor = node => {
+            if (TypeScript.isJsxAttribute(node)) {
+                if (DataTestIdAttributes.indexOf(node.name.getText()) > -1) {
+                    return undefined;
+                }
+            }
+            return TypeScript.visitEachChild(node, visit, context);
+        };
+        return node => TypeScript.visitNode(node, visit);
+    };
 }

ViewGenerator/tools/webpack/Rules/TypeScript.ts

@@ -1,8 +1,9 @@
 import { cpus } from "os";
+import { join } from "path";
 import { RuleSetRule, RuleSetUseItem } from "webpack";
 
 // .ts / .tsx  files
-const getTypeScriptRuleSet = (forHotReload: boolean): RuleSetRule => {
+const getTypeScriptRuleSet = (forHotReload: boolean, isProductionBuild: boolean): RuleSetRule => {
 
     const TypeScriptRule: RuleSetRule = {
         test: /\.tsx?$/i,
@@ -22,7 +23,8 @@ const getTypeScriptRuleSet = (forHotReload: boolean): RuleSetRule => {
     let tsLoaderRule: RuleSetUseItem = {
         loader: "ts-loader",
         options: {
-            happyPackMode: true
+            happyPackMode: true,
+            getCustomTransformers: isProductionBuild ? join(__dirname, "../Plugins/DataTestIdTransformerPlugin.js") : null
         }
     };
 

ViewGenerator/tools/webpack/webpack_plugins.config.ts

@@ -8,7 +8,7 @@ import { getCurrentDirectory, sanitizeCommandLineParam } from "./Plugins/Utils";
 
 const config = (env) => {
 
-    const standardConfig: Configuration = getCommonConfiguration(env.useCache ? "pluginsCache" : "", "Plugins", sanitizeCommandLineParam(env.assemblyName));
+    const standardConfig: Configuration = getCommonConfiguration(env.useCache === "true" ? "pluginsCache" : "", "Plugins", sanitizeCommandLineParam(env.assemblyName));
 
     standardConfig.optimization = {
         runtimeChunk: {

ViewGenerator/tools/webpack/webpack_stylesheets.config.ts

@@ -29,12 +29,6 @@ const config = (env) => {
             publicPath: "/"
         },
 
-        cache: {
-            type: 'filesystem',
-            allowCollectingMemory: true,
-            name: "stylesheetsCache"
-        },
-
         resolveLoader: {
             modules: [ join(__dirname, "/node_modules") ],
         },
@@ -55,6 +49,14 @@ const config = (env) => {
             new MiniCssExtractPluginCleanup([/\.js.map$/]),
         ]
     }
+
+    if (env.useCache === "true") {
+        stylesheetsConfig.cache = {
+            type: 'filesystem',
+            allowCollectingMemory: true,
+            name: "stylesheetsCache"
+        };
+    }
 
     return stylesheetsConfig;
 };

ViewGenerator/tools/webpack/webpack_views.config.ts

@@ -38,7 +38,12 @@ const config = (env) => {
 
     const sanitizedPluginsRelativePath: string = sanitizeCommandLineParam(env.pluginsRelativePath);
 
-    const standardConfig: Configuration = getCommonConfiguration(env.useCache ? "viewsCache" : "", "Views", sanitizeCommandLineParam(env.assemblyName), sanitizedPluginsRelativePath, env.forHotReload);
+    const standardConfig: Configuration = getCommonConfiguration(
+        env.useCache === "true" ? "viewsCache" : "",
+        "Views",
+        sanitizeCommandLineParam(env.assemblyName),
+        sanitizedPluginsRelativePath, 
+        env.forHotReload === "true");
 
     if (!standardConfig.optimization) {
         standardConfig.optimization = {};
@@ -48,7 +53,7 @@ const config = (env) => {
             name: "ViewsRuntime"
     };
 
-    if (env.optimizebundle) {
+    if (env.optimizeBundle === "true") {
         // SplitChunksOptions
         standardConfig.optimization.splitChunks = {
             chunks: "all",
@@ -85,7 +90,7 @@ const config = (env) => {
         ];
     }
 
-    if (env.forHotReload) {
+    if (env.forHotReload === "true") {
         standardConfig.output.hotUpdateChunkFilename = OutputDirectoryDefault + IdPlaceholder + "." + FullHashPlaceholder + ".hot-update.js";
         standardConfig.output.hotUpdateMainFilename = OutputDirectoryDefault + RuntimePlaceholder + "." + FullHashPlaceholder + ".hot-update.json";
 

ViewGenerator/tools/webpack/webpack_workers.config.ts

@@ -1,8 +1,9 @@
 import { sync } from "glob";
 import { parse, resolve } from "path";
 import { getCurrentDirectory } from "./Plugins/Utils";
+import {Configuration} from "webpack";
 
-const config = (_, __) => {
+const config = (env) => {
 
     let entryMap = {};
 
@@ -11,21 +12,28 @@ const config = (_, __) => {
         entryMap[entryName] = "./" + f;
     });
 
-    return {
+    const workersConfig: Configuration = {
         entry: entryMap,
+
         optimization: {
             minimize: true
         },
-        cache: {
-            type: 'filesystem',
-            allowCollectingMemory: true,
-            name: "workersCache"
-        },
+
         output: {
             globalObject: 'self',
             path: resolve(getCurrentDirectory(), "Generated")
         },
     };
+
+    if (env.useCache === "true") {
+        workersConfig.cache = {
+            type: 'filesystem',
+            allowCollectingMemory: true,
+            name: "workersCache" 
+        }
+    }
+
+    return workersConfig;
 };
 
 export default config;