Detect formatted React.createClass calls

Author: OskarEichler

packages/react-native-babel-preset/src/__tests__/transform-snapshot-test.js

@@ -171,6 +171,21 @@ function transformCode(
   return result?.code ?? null;
 }
 
+function transformCodeWithSourceOptimization(
+  code: string,
+  options: {[string]: unknown},
+): string | null {
+  const config = preset.getPreset(code, options);
+  const result = babel.transformSync(code, {
+    ...config,
+    babelrc: false,
+    configFile: false,
+    filename: MOCK_FILENAME,
+    sourceMaps: false,
+  });
+  return result?.code ?? null;
+}
+
 function getSnapshotPath(configName: string): string {
   return path.join(OUTPUT_DIR, `${configName}.js`);
 }
@@ -267,6 +282,16 @@ describe('react-native-babel-preset transform snapshots', () => {
   );
 
   describe('specific feature transformations', () => {
+    it('adds display names when React.createClass contains trivia', () => {
+      const code = `
+        const Component = React /* comment */ . createClass({
+          render() { return null; }
+        });
+      `;
+      const result = transformCodeWithSourceOptimization(code, {dev: false});
+      expect(result).toContain('displayName:"Component"');
+    });
+
     it('handles async generators', () => {
       const code = `
         async function* gen() {

packages/react-native-babel-preset/src/configs/main.js

@@ -190,7 +190,7 @@ const getPreset = (src, options, babel) => {
   }
   if (
     isNull ||
-    src.indexOf('React.createClass') !== -1 ||
+    src.indexOf('createClass') !== -1 ||
     src.indexOf('createReactClass') !== -1
   ) {
     extraPlugins.push([require('@babel/plugin-transform-react-display-name')]);