From 06b41bdbacd992455d37bfc758a336bd9f406d97 Mon Sep 17 00:00:00 2001 From: Ash Anand Date: Wed, 10 Jul 2024 13:03:04 -0400 Subject: [PATCH 01/12] Create options for skipping annotations on components --- packages/bundler-plugin-core/src/index.ts | 5 ++++- packages/bundler-plugin-core/src/types.ts | 8 ++++++++ .../dev-utils/src/generate-documentation-table.ts | 14 ++++++++++++++ packages/rollup-plugin/src/index.ts | 7 +++++-- packages/vite-plugin/src/index.ts | 7 +++++-- packages/webpack-plugin/src/index.ts | 7 +++++-- 6 files changed, 41 insertions(+), 7 deletions(-) diff --git a/packages/bundler-plugin-core/src/index.ts b/packages/bundler-plugin-core/src/index.ts index d7dc2585..4e2dda7c 100644 --- a/packages/bundler-plugin-core/src/index.ts +++ b/packages/bundler-plugin-core/src/index.ts @@ -610,7 +610,10 @@ export function createRollupDebugIdUploadHooks( }; } -export function createComponentNameAnnotateHooks() { +export function createComponentNameAnnotateHooks( + ignoredFiles?: string[], + ignoredComponents?: string[] +) { type ParserPlugins = NonNullable< NonNullable[1]>["parserOpts"] >["plugins"]; diff --git a/packages/bundler-plugin-core/src/types.ts b/packages/bundler-plugin-core/src/types.ts index b7799e08..321a562c 100644 --- a/packages/bundler-plugin-core/src/types.ts +++ b/packages/bundler-plugin-core/src/types.ts @@ -302,6 +302,14 @@ export interface Options { * Whether the component name annotate plugin should be enabled or not. */ enabled?: boolean; + /** + * A list of strings representing local paths to files to ignore. The plugin will not perform any annotations on components in these files + */ + ignoredFiles?: string[]; + /** + * A list of strings representing the names of components to ignore. The plugin will not perform any annotations on these components + */ + ignoredComponents?: string[]; }; /** diff --git a/packages/dev-utils/src/generate-documentation-table.ts b/packages/dev-utils/src/generate-documentation-table.ts index e79dc639..33ab825a 100644 --- a/packages/dev-utils/src/generate-documentation-table.ts +++ b/packages/dev-utils/src/generate-documentation-table.ts @@ -359,6 +359,20 @@ type IncludeEntry = { fullDescription: "Whether the component name annotate plugin should be enabled or not.", supportedBundlers: ["webpack", "vite", "rollup"], }, + { + name: "ignoredFiles", + type: "string[]", + fullDescription: + "A list of strings representing local paths to files to ignore. The plugin will not perform any annotations on components in these files.", + supportedBundlers: ["webpack", "vite", "rollup"], + }, + { + name: "ignoredComponents", + type: "string[]", + fullDescription: + "A list of strings representing the names of components to ignore. The plugin will not perform any annotations on these components.", + supportedBundlers: ["webpack", "vite", "rollup"], + }, ], }, { diff --git a/packages/rollup-plugin/src/index.ts b/packages/rollup-plugin/src/index.ts index dbdd63b8..2e78ab04 100644 --- a/packages/rollup-plugin/src/index.ts +++ b/packages/rollup-plugin/src/index.ts @@ -18,10 +18,13 @@ function rollupReleaseInjectionPlugin(injectionCode: string): UnpluginOptions { }; } -function rollupComponentNameAnnotatePlugin(): UnpluginOptions { +function rollupComponentNameAnnotatePlugin( + ignoredFiles?: string[], + ignoredComponents?: string[] +): UnpluginOptions { return { name: "sentry-rollup-component-name-annotate-plugin", - rollup: createComponentNameAnnotateHooks(), + rollup: createComponentNameAnnotateHooks(ignoredFiles, ignoredComponents), }; } diff --git a/packages/vite-plugin/src/index.ts b/packages/vite-plugin/src/index.ts index d840077b..bf53a819 100644 --- a/packages/vite-plugin/src/index.ts +++ b/packages/vite-plugin/src/index.ts @@ -19,11 +19,14 @@ function viteReleaseInjectionPlugin(injectionCode: string): UnpluginOptions { }; } -function viteComponentNameAnnotatePlugin(): UnpluginOptions { +function viteComponentNameAnnotatePlugin( + ignoredFiles?: string[], + ignoredComponents?: string[] +): UnpluginOptions { return { name: "sentry-vite-component-name-annotate-plugin", enforce: "pre" as const, - vite: createComponentNameAnnotateHooks(), + vite: createComponentNameAnnotateHooks(ignoredFiles, ignoredComponents), }; } diff --git a/packages/webpack-plugin/src/index.ts b/packages/webpack-plugin/src/index.ts index 39b62332..ef493d4b 100644 --- a/packages/webpack-plugin/src/index.ts +++ b/packages/webpack-plugin/src/index.ts @@ -47,7 +47,10 @@ function webpackReleaseInjectionPlugin(injectionCode: string): UnpluginOptions { }; } -function webpackComponentNameAnnotatePlugin(): UnpluginOptions { +function webpackComponentNameAnnotatePlugin( + ignoredFiles?: string[], + ignoredComponents?: string[] +): UnpluginOptions { return { name: "sentry-webpack-component-name-annotate-plugin", enforce: "pre", @@ -55,7 +58,7 @@ function webpackComponentNameAnnotatePlugin(): UnpluginOptions { transformInclude(id) { return id.endsWith(".tsx") || id.endsWith(".jsx"); }, - transform: createComponentNameAnnotateHooks().transform, + transform: createComponentNameAnnotateHooks(ignoredFiles, ignoredComponents).transform, }; } From 911cd635735700282eb57d25338984a25646371b Mon Sep 17 00:00:00 2001 From: Ash Anand Date: Wed, 10 Jul 2024 15:31:02 -0400 Subject: [PATCH 02/12] skip annotation on files that are in `ignoredFiles` --- packages/bundler-plugin-core/src/index.ts | 6 ++++++ 1 file changed, 6 insertions(+) diff --git a/packages/bundler-plugin-core/src/index.ts b/packages/bundler-plugin-core/src/index.ts index 4e2dda7c..fafbda82 100644 --- a/packages/bundler-plugin-core/src/index.ts +++ b/packages/bundler-plugin-core/src/index.ts @@ -627,6 +627,12 @@ export function createComponentNameAnnotateHooks( return null; } + const isIgnoredFile = ignoredFiles?.some((file) => idWithoutQueryAndHash.endsWith(file)); + if (isIgnoredFile) { + console.log(`FOUND IGNORED FILE: ${idWithoutQueryAndHash}`); + return null; + } + // We will only apply this plugin on jsx and tsx files if (![".jsx", ".tsx"].some((ending) => idWithoutQueryAndHash.endsWith(ending))) { return null; From 213cb8cc0bf0bea0895baece117d80b6c3f3b560 Mon Sep 17 00:00:00 2001 From: Ash Anand Date: Tue, 8 Oct 2024 13:37:47 -0400 Subject: [PATCH 03/12] wire up options to allow bundler plugins to skip certain files for react annotation --- packages/bundler-plugin-core/src/index.ts | 28 +++++++++++++++++------ 1 file changed, 21 insertions(+), 7 deletions(-) diff --git a/packages/bundler-plugin-core/src/index.ts b/packages/bundler-plugin-core/src/index.ts index fafbda82..e2ff2ed0 100644 --- a/packages/bundler-plugin-core/src/index.ts +++ b/packages/bundler-plugin-core/src/index.ts @@ -29,7 +29,10 @@ import { fileDeletionPlugin } from "./plugins/sourcemap-deletion"; interface SentryUnpluginFactoryOptions { releaseInjectionPlugin: (injectionCode: string) => UnpluginOptions; - componentNameAnnotatePlugin?: () => UnpluginOptions; + componentNameAnnotatePlugin?: ( + ignoredFiles?: string[], + ignoredComponents?: string[] + ) => UnpluginOptions; moduleMetadataInjectionPlugin: (injectionCode: string) => UnpluginOptions; debugIdInjectionPlugin: (logger: Logger) => UnpluginOptions; debugIdUploadPlugin: (upload: (buildArtifacts: string[]) => Promise) => UnpluginOptions; @@ -399,7 +402,13 @@ export function sentryUnpluginFactory({ "The component name annotate plugin is currently not supported by '@sentry/esbuild-plugin'" ); } else { - componentNameAnnotatePlugin && plugins.push(componentNameAnnotatePlugin()); + componentNameAnnotatePlugin && + plugins.push( + componentNameAnnotatePlugin( + options.reactComponentAnnotation.ignoredFiles, + options.reactComponentAnnotation.ignoredComponents + ) + ); } } @@ -627,14 +636,19 @@ export function createComponentNameAnnotateHooks( return null; } - const isIgnoredFile = ignoredFiles?.some((file) => idWithoutQueryAndHash.endsWith(file)); - if (isIgnoredFile) { - console.log(`FOUND IGNORED FILE: ${idWithoutQueryAndHash}`); + // We will only apply this plugin on jsx and tsx files + if (![".jsx", ".tsx"].some((ending) => idWithoutQueryAndHash.endsWith(ending))) { return null; } - // We will only apply this plugin on jsx and tsx files - if (![".jsx", ".tsx"].some((ending) => idWithoutQueryAndHash.endsWith(ending))) { + console.log("ignored files:"); + console.dir(ignoredFiles); + console.log("current file:"); + console.log(idWithoutQueryAndHash); + + const isIgnoredFile = ignoredFiles?.some((file) => idWithoutQueryAndHash.endsWith(file)); + if (isIgnoredFile) { + console.log(`FOUND IGNORED FILE: ${idWithoutQueryAndHash}`); return null; } From 5374baa76d9a60406cd94068341173bb152f2f56 Mon Sep 17 00:00:00 2001 From: Ash Anand Date: Tue, 8 Oct 2024 17:33:52 -0400 Subject: [PATCH 04/12] remove support for ignoreFiles for now but add support for ignoreComponents --- .../src/index.ts | 15 ++++------ packages/bundler-plugin-core/src/index.ts | 28 +++---------------- packages/bundler-plugin-core/src/types.ts | 9 +++--- .../src/generate-documentation-table.ts | 19 +++++++------ packages/rollup-plugin/src/index.ts | 7 ++--- packages/vite-plugin/src/index.ts | 7 ++--- packages/webpack-plugin/src/index.ts | 7 ++--- 7 files changed, 30 insertions(+), 62 deletions(-) diff --git a/packages/babel-plugin-component-annotate/src/index.ts b/packages/babel-plugin-component-annotate/src/index.ts index 56b0c808..91f6ced4 100644 --- a/packages/babel-plugin-component-annotate/src/index.ts +++ b/packages/babel-plugin-component-annotate/src/index.ts @@ -48,15 +48,13 @@ const nativeSourceFileName = "dataSentrySourceFile"; interface AnnotationOpts { native?: boolean; "annotate-fragments"?: boolean; - ignoreComponents?: IgnoredComponent[]; + ignoreComponents?: string[]; } interface AnnotationPluginPass extends PluginPass { opts: AnnotationOpts; } -type IgnoredComponent = [file: string, component: string, element: string]; - type AnnotationPlugin = PluginObj; // We must export the plugin as default, otherwise the Babel loader will not be able to resolve it when configured using its string identifier @@ -152,7 +150,7 @@ function functionBodyPushAttributes( componentName: string, sourceFileName: string | undefined, attributeNames: string[], - ignoredComponents: IgnoredComponent[] + ignoredComponents: string[] ) { let jsxNode: Babel.NodePath; @@ -218,7 +216,7 @@ function processJSX( componentName: string | null, sourceFileName: string | undefined, attributeNames: string[], - ignoredComponents: IgnoredComponent[] + ignoredComponents: string[] ) { if (!jsxNode) { return; @@ -294,7 +292,7 @@ function applyAttributes( componentName: string | null, sourceFileName: string | undefined, attributeNames: string[], - ignoredComponents: IgnoredComponent[] + ignoredComponents: string[] ) { const [componentAttributeName, elementAttributeName, sourceFileAttributeName] = attributeNames; @@ -310,10 +308,7 @@ function applyAttributes( const elementName = getPathName(t, openingElement); const isAnIgnoredComponent = ignoredComponents.some( - (ignoredComponent) => - matchesIgnoreRule(ignoredComponent[0], sourceFileName) && - matchesIgnoreRule(ignoredComponent[1], componentName) && - matchesIgnoreRule(ignoredComponent[2], elementName) + (ignoredComponent) => ignoredComponent === componentName || ignoredComponent === elementName ); // Add a stable attribute for the element name but only for non-DOM names diff --git a/packages/bundler-plugin-core/src/index.ts b/packages/bundler-plugin-core/src/index.ts index e2ff2ed0..9b8b53e1 100644 --- a/packages/bundler-plugin-core/src/index.ts +++ b/packages/bundler-plugin-core/src/index.ts @@ -29,10 +29,7 @@ import { fileDeletionPlugin } from "./plugins/sourcemap-deletion"; interface SentryUnpluginFactoryOptions { releaseInjectionPlugin: (injectionCode: string) => UnpluginOptions; - componentNameAnnotatePlugin?: ( - ignoredFiles?: string[], - ignoredComponents?: string[] - ) => UnpluginOptions; + componentNameAnnotatePlugin?: (ignoreComponents?: string[]) => UnpluginOptions; moduleMetadataInjectionPlugin: (injectionCode: string) => UnpluginOptions; debugIdInjectionPlugin: (logger: Logger) => UnpluginOptions; debugIdUploadPlugin: (upload: (buildArtifacts: string[]) => Promise) => UnpluginOptions; @@ -404,10 +401,7 @@ export function sentryUnpluginFactory({ } else { componentNameAnnotatePlugin && plugins.push( - componentNameAnnotatePlugin( - options.reactComponentAnnotation.ignoredFiles, - options.reactComponentAnnotation.ignoredComponents - ) + componentNameAnnotatePlugin(options.reactComponentAnnotation.ignoreComponents) ); } } @@ -619,10 +613,7 @@ export function createRollupDebugIdUploadHooks( }; } -export function createComponentNameAnnotateHooks( - ignoredFiles?: string[], - ignoredComponents?: string[] -) { +export function createComponentNameAnnotateHooks(ignoreComponents?: string[]) { type ParserPlugins = NonNullable< NonNullable[1]>["parserOpts"] >["plugins"]; @@ -641,17 +632,6 @@ export function createComponentNameAnnotateHooks( return null; } - console.log("ignored files:"); - console.dir(ignoredFiles); - console.log("current file:"); - console.log(idWithoutQueryAndHash); - - const isIgnoredFile = ignoredFiles?.some((file) => idWithoutQueryAndHash.endsWith(file)); - if (isIgnoredFile) { - console.log(`FOUND IGNORED FILE: ${idWithoutQueryAndHash}`); - return null; - } - const parserPlugins: ParserPlugins = []; if (idWithoutQueryAndHash.endsWith(".jsx")) { parserPlugins.push("jsx"); @@ -661,7 +641,7 @@ export function createComponentNameAnnotateHooks( try { const result = await transformAsync(code, { - plugins: [[componentNameAnnotatePlugin]], + plugins: [[componentNameAnnotatePlugin, { ignoreComponents }]], filename: id, parserOpts: { sourceType: "module", diff --git a/packages/bundler-plugin-core/src/types.ts b/packages/bundler-plugin-core/src/types.ts index 321a562c..62b6d928 100644 --- a/packages/bundler-plugin-core/src/types.ts +++ b/packages/bundler-plugin-core/src/types.ts @@ -303,13 +303,14 @@ export interface Options { */ enabled?: boolean; /** - * A list of strings representing local paths to files to ignore. The plugin will not perform any annotations on components in these files + * A list of strings representing the names of components to ignore. The plugin will not perform any annotations on these components */ - ignoredFiles?: string[]; + ignoreComponents?: string[]; + // TODO: Support this option in the future /** - * A list of strings representing the names of components to ignore. The plugin will not perform any annotations on these components + * A list of strings representing local paths to files to ignore. The plugin will not perform any annotations on components in these files */ - ignoredComponents?: string[]; + // ignoreFiles?: string[]; }; /** diff --git a/packages/dev-utils/src/generate-documentation-table.ts b/packages/dev-utils/src/generate-documentation-table.ts index 33ab825a..4b8c0ce9 100644 --- a/packages/dev-utils/src/generate-documentation-table.ts +++ b/packages/dev-utils/src/generate-documentation-table.ts @@ -360,19 +360,20 @@ type IncludeEntry = { supportedBundlers: ["webpack", "vite", "rollup"], }, { - name: "ignoredFiles", + name: "ignoreComponents", type: "string[]", fullDescription: - "A list of strings representing local paths to files to ignore. The plugin will not perform any annotations on components in these files.", - supportedBundlers: ["webpack", "vite", "rollup"], - }, - { - name: "ignoredComponents", - type: "string[]", - fullDescription: - "A list of strings representing the names of components to ignore. The plugin will not perform any annotations on these components.", + "A list of strings representing the names of components to ignore. The plugin will not perform apply `data-sentry` annotations on the DOM element for this component.", supportedBundlers: ["webpack", "vite", "rollup"], }, + // TODO: Support this option in the future + // { + // name: "ignoreFiles", + // type: "string[]", + // fullDescription: + // "A list of strings representing local paths to files to ignore. The plugin will not perform any annotations on components in these files.", + // supportedBundlers: ["webpack", "vite", "rollup"], + // }, ], }, { diff --git a/packages/rollup-plugin/src/index.ts b/packages/rollup-plugin/src/index.ts index 2e78ab04..9a7d24ec 100644 --- a/packages/rollup-plugin/src/index.ts +++ b/packages/rollup-plugin/src/index.ts @@ -18,13 +18,10 @@ function rollupReleaseInjectionPlugin(injectionCode: string): UnpluginOptions { }; } -function rollupComponentNameAnnotatePlugin( - ignoredFiles?: string[], - ignoredComponents?: string[] -): UnpluginOptions { +function rollupComponentNameAnnotatePlugin(ignoreComponents?: string[]): UnpluginOptions { return { name: "sentry-rollup-component-name-annotate-plugin", - rollup: createComponentNameAnnotateHooks(ignoredFiles, ignoredComponents), + rollup: createComponentNameAnnotateHooks(ignoreComponents), }; } diff --git a/packages/vite-plugin/src/index.ts b/packages/vite-plugin/src/index.ts index bf53a819..8614364d 100644 --- a/packages/vite-plugin/src/index.ts +++ b/packages/vite-plugin/src/index.ts @@ -19,14 +19,11 @@ function viteReleaseInjectionPlugin(injectionCode: string): UnpluginOptions { }; } -function viteComponentNameAnnotatePlugin( - ignoredFiles?: string[], - ignoredComponents?: string[] -): UnpluginOptions { +function viteComponentNameAnnotatePlugin(ignoreComponents?: string[]): UnpluginOptions { return { name: "sentry-vite-component-name-annotate-plugin", enforce: "pre" as const, - vite: createComponentNameAnnotateHooks(ignoredFiles, ignoredComponents), + vite: createComponentNameAnnotateHooks(ignoreComponents), }; } diff --git a/packages/webpack-plugin/src/index.ts b/packages/webpack-plugin/src/index.ts index ef493d4b..9d46bddc 100644 --- a/packages/webpack-plugin/src/index.ts +++ b/packages/webpack-plugin/src/index.ts @@ -47,10 +47,7 @@ function webpackReleaseInjectionPlugin(injectionCode: string): UnpluginOptions { }; } -function webpackComponentNameAnnotatePlugin( - ignoredFiles?: string[], - ignoredComponents?: string[] -): UnpluginOptions { +function webpackComponentNameAnnotatePlugin(ignoreComponents?: string[]): UnpluginOptions { return { name: "sentry-webpack-component-name-annotate-plugin", enforce: "pre", @@ -58,7 +55,7 @@ function webpackComponentNameAnnotatePlugin( transformInclude(id) { return id.endsWith(".tsx") || id.endsWith(".jsx"); }, - transform: createComponentNameAnnotateHooks(ignoredFiles, ignoredComponents).transform, + transform: createComponentNameAnnotateHooks(ignoreComponents).transform, }; } From 3a652273bf5d798995a7ad691acff95761e2de72 Mon Sep 17 00:00:00 2001 From: Ash Anand Date: Tue, 8 Oct 2024 17:47:25 -0400 Subject: [PATCH 05/12] update documentation --- packages/babel-plugin-component-annotate/README.md | 11 ++++++++++- .../dev-utils/src/generate-documentation-table.ts | 2 +- 2 files changed, 11 insertions(+), 2 deletions(-) diff --git a/packages/babel-plugin-component-annotate/README.md b/packages/babel-plugin-component-annotate/README.md index 7d079934..b1fcd255 100644 --- a/packages/babel-plugin-component-annotate/README.md +++ b/packages/babel-plugin-component-annotate/README.md @@ -47,6 +47,14 @@ Using pnpm: pnpm add @sentry/babel-plugin-component-annotate --save-dev ``` +## Options + +### `ignoreComponents` + +Type: `string[]` + +A list of strings representing the names of components to ignore. The plugin will not perform apply `data-sentry` annotations on the DOM element for these components. + ## Example ```js @@ -57,7 +65,8 @@ pnpm add @sentry/babel-plugin-component-annotate --save-dev plugins: [ // Put this plugin before any other plugins you have that transform JSX code - ['@sentry/babel-plugin-component-annotate'] + // The options are set by providing an object as the second element in the array, but not required + ['@sentry/babel-plugin-component-annotate', {ignoreComponents: ['Foo', 'Bar']}] ], } ``` diff --git a/packages/dev-utils/src/generate-documentation-table.ts b/packages/dev-utils/src/generate-documentation-table.ts index 4b8c0ce9..488bb30b 100644 --- a/packages/dev-utils/src/generate-documentation-table.ts +++ b/packages/dev-utils/src/generate-documentation-table.ts @@ -363,7 +363,7 @@ type IncludeEntry = { name: "ignoreComponents", type: "string[]", fullDescription: - "A list of strings representing the names of components to ignore. The plugin will not perform apply `data-sentry` annotations on the DOM element for this component.", + "A list of strings representing the names of components to ignore. The plugin will not perform apply `data-sentry` annotations on the DOM element for these components.", supportedBundlers: ["webpack", "vite", "rollup"], }, // TODO: Support this option in the future From 90fbd8a2745f262530bf09824d7ddd4d5418a44f Mon Sep 17 00:00:00 2001 From: Ash Anand Date: Mon, 6 Jan 2025 14:51:00 -0500 Subject: [PATCH 06/12] fix a test and remove some unnecessary tests --- .../test/test-plugin.test.ts | 686 +----------------- 1 file changed, 1 insertion(+), 685 deletions(-) diff --git a/packages/babel-plugin-component-annotate/test/test-plugin.test.ts b/packages/babel-plugin-component-annotate/test/test-plugin.test.ts index 97a632bf..6790b933 100644 --- a/packages/babel-plugin-component-annotate/test/test-plugin.test.ts +++ b/packages/babel-plugin-component-annotate/test/test-plugin.test.ts @@ -1281,7 +1281,7 @@ it("Bananas ignore components dataSentrySourceFile=* dataSentryComponent=* dataS filename: "/filename-test.js", configFile: false, presets: ["@babel/preset-react"], - plugins: [[plugin, { native: true, ignoreComponents: [["*", "*", "Image"]] }]], + plugins: [[plugin, { native: true, ignoreComponents: ["Image"] }]], }); expect(result?.code).toMatchInlineSnapshot(` "import React, { Component } from 'react'; @@ -1305,690 +1305,6 @@ it("Bananas ignore components dataSentrySourceFile=* dataSentryComponent=* dataS `); }); -// This tests out matching only `dataSentryElement` and `dataSentryComponent`, with * for `dataSentrySourceFile` -it("Bananas ignore components dataSentrySourceFile=* dataSentryComponent=match dataSentryElement=match snapshot matches", () => { - const result = transform(BananasStandardInput, { - filename: "/filename-test.js", - configFile: false, - presets: ["@babel/preset-react"], - plugins: [[plugin, { native: true, ignoreComponents: [["*", "Bananas", "Image"]] }]], - }); - expect(result?.code).toMatchInlineSnapshot(` - "import React, { Component } from 'react'; - import { Image } from 'react-native'; - class Bananas extends Component { - render() { - let pic = { - uri: 'https://upload.wikimedia.org/wikipedia/commons/d/de/Bananavarieties.jpg' - }; - return /*#__PURE__*/React.createElement(Image, { - source: pic, - style: { - width: 193, - height: 110, - marginTop: 10 - }, - fsClass: \\"test-class\\" - }); - } - }" - `); -}); - -// This tests out matching on all 3 of our ignore list values -it("Bananas ignore components dataSentrySourceFile=match dataSentryComponent=match dataSentryElement=match snapshot matches", () => { - const result = transform(BananasStandardInput, { - filename: "/filename-test.js", - configFile: false, - presets: ["@babel/preset-react"], - plugins: [ - [plugin, { native: true, ignoreComponents: [["filename-test.js", "Bananas", "Image"]] }], - ], - }); - expect(result?.code).toMatchInlineSnapshot(` - "import React, { Component } from 'react'; - import { Image } from 'react-native'; - class Bananas extends Component { - render() { - let pic = { - uri: 'https://upload.wikimedia.org/wikipedia/commons/d/de/Bananavarieties.jpg' - }; - return /*#__PURE__*/React.createElement(Image, { - source: pic, - style: { - width: 193, - height: 110, - marginTop: 10 - }, - fsClass: \\"test-class\\" - }); - } - }" - `); -}); - -// This tests out matching on all 3 of our ignore list values via * -it("Bananas/Pizza/App ignore components dataSentrySourceFile=* dataSentryComponent=* dataSentryElement=* snapshot matches", () => { - const result = transform(BananasPizzaAppStandardInput, { - filename: "/filename-test.js", - configFile: false, - presets: ["@babel/preset-react"], - plugins: [[plugin, { native: true, ignoreComponents: [["*", "*", "*"]] }]], - }); - expect(result?.code).toMatchInlineSnapshot(` - "import React, { Component } from 'react'; - import { StyleSheet, Text, TextInput, View, Image, UIManager } from 'react-native'; - UIManager.getViewManagerConfig('RCTView').NativeProps.fsClass = \\"String\\"; - class Bananas extends Component { - render() { - let pic = { - uri: 'https://upload.wikimedia.org/wikipedia/commons/d/de/Bananavarieties.jpg' - }; - return /*#__PURE__*/React.createElement(Image, { - source: pic, - style: { - width: 193, - height: 110, - marginTop: 10 - }, - fsClass: \\"test-class\\" - }); - } - } - class PizzaTranslator extends Component { - constructor(props) { - super(props); - this.state = { - text: '' - }; - } - render() { - return /*#__PURE__*/React.createElement(View, { - style: { - padding: 10 - } - }, /*#__PURE__*/React.createElement(TextInput, { - style: { - backgroundColor: '#000', - color: '#eee', - padding: 8 - }, - placeholder: \\"Type here to translate!\\" // not supported on iOS - , - onChangeText: text => this.setState({ - text - }), - value: this.state.text - }), /*#__PURE__*/React.createElement(Text, { - style: { - padding: 10, - fontSize: 42 - } - }, this.state.text.split(' ').map(word => word && '🍕').join(' '))); - } - } - export default function App() { - return /*#__PURE__*/React.createElement(View, { - style: styles.container - }, /*#__PURE__*/React.createElement(Text, { - style: { - color: '#eee' - } - }, \\"FullStory ReactNative testing app\\"), /*#__PURE__*/React.createElement(Bananas, null), /*#__PURE__*/React.createElement(PizzaTranslator, null)); - } - const styles = StyleSheet.create({ - container: { - flex: 1, - justifyContent: 'center', - alignItems: 'stretch', - backgroundColor: '#222', - alignItems: 'center', - justifyContent: 'center' - } - });" - `); -}); - -// This tests out matching on all 3 of our ignore list values -it("Bananas/Pizza/App ignore components dataSentrySourceFile=nomatch dataSentryComponent=* dataSentryElement=* snapshot matches", () => { - const result = transform(BananasPizzaAppStandardInput, { - filename: "/filename-test.js", - configFile: false, - presets: ["@babel/preset-react"], - plugins: [[plugin, { native: true, ignoreComponents: [["nomatch.js", "*", "*"]] }]], - }); - expect(result?.code).toMatchInlineSnapshot(` - "import React, { Component } from 'react'; - import { StyleSheet, Text, TextInput, View, Image, UIManager } from 'react-native'; - UIManager.getViewManagerConfig('RCTView').NativeProps.fsClass = \\"String\\"; - class Bananas extends Component { - render() { - let pic = { - uri: 'https://upload.wikimedia.org/wikipedia/commons/d/de/Bananavarieties.jpg' - }; - return /*#__PURE__*/React.createElement(Image, { - source: pic, - style: { - width: 193, - height: 110, - marginTop: 10 - }, - fsClass: \\"test-class\\", - dataSentryElement: \\"Image\\", - dataSentryComponent: \\"Bananas\\", - dataSentrySourceFile: \\"filename-test.js\\" - }); - } - } - class PizzaTranslator extends Component { - constructor(props) { - super(props); - this.state = { - text: '' - }; - } - render() { - return /*#__PURE__*/React.createElement(View, { - style: { - padding: 10 - }, - dataSentryElement: \\"View\\", - dataSentryComponent: \\"PizzaTranslator\\", - dataSentrySourceFile: \\"filename-test.js\\" - }, /*#__PURE__*/React.createElement(TextInput, { - style: { - backgroundColor: '#000', - color: '#eee', - padding: 8 - }, - placeholder: \\"Type here to translate!\\" // not supported on iOS - , - onChangeText: text => this.setState({ - text - }), - value: this.state.text, - dataSentryElement: \\"TextInput\\", - dataSentrySourceFile: \\"filename-test.js\\" - }), /*#__PURE__*/React.createElement(Text, { - style: { - padding: 10, - fontSize: 42 - }, - dataSentryElement: \\"Text\\", - dataSentrySourceFile: \\"filename-test.js\\" - }, this.state.text.split(' ').map(word => word && '🍕').join(' '))); - } - } - export default function App() { - return /*#__PURE__*/React.createElement(View, { - style: styles.container, - dataSentryElement: \\"View\\", - dataSentryComponent: \\"App\\", - dataSentrySourceFile: \\"filename-test.js\\" - }, /*#__PURE__*/React.createElement(Text, { - style: { - color: '#eee' - }, - dataSentryElement: \\"Text\\", - dataSentrySourceFile: \\"filename-test.js\\" - }, \\"FullStory ReactNative testing app\\"), /*#__PURE__*/React.createElement(Bananas, { - dataSentryElement: \\"Bananas\\", - dataSentrySourceFile: \\"filename-test.js\\" - }), /*#__PURE__*/React.createElement(PizzaTranslator, { - dataSentryElement: \\"PizzaTranslator\\", - dataSentrySourceFile: \\"filename-test.js\\" - })); - } - const styles = StyleSheet.create({ - container: { - flex: 1, - justifyContent: 'center', - alignItems: 'stretch', - backgroundColor: '#222', - alignItems: 'center', - justifyContent: 'center' - } - });" - `); -}); - -it("Bananas/Pizza/App only Bananas dataSentrySourceFile=match dataSentryComponent=match dataSentryElement=match snapshot matches", () => { - const result = transform(BananasPizzaAppStandardInput, { - filename: "/filename-test.js", - configFile: false, - presets: ["@babel/preset-react"], - plugins: [ - [ - plugin, - { - native: true, - ignoreComponents: [ - // Pizza - ["filename-test.js", "PizzaTranslator", "View"], - // App - ["filename-test.js", "App", "View"], - ], - }, - ], - ], - }); - expect(result?.code).toMatchInlineSnapshot(` - "import React, { Component } from 'react'; - import { StyleSheet, Text, TextInput, View, Image, UIManager } from 'react-native'; - UIManager.getViewManagerConfig('RCTView').NativeProps.fsClass = \\"String\\"; - class Bananas extends Component { - render() { - let pic = { - uri: 'https://upload.wikimedia.org/wikipedia/commons/d/de/Bananavarieties.jpg' - }; - return /*#__PURE__*/React.createElement(Image, { - source: pic, - style: { - width: 193, - height: 110, - marginTop: 10 - }, - fsClass: \\"test-class\\", - dataSentryElement: \\"Image\\", - dataSentryComponent: \\"Bananas\\", - dataSentrySourceFile: \\"filename-test.js\\" - }); - } - } - class PizzaTranslator extends Component { - constructor(props) { - super(props); - this.state = { - text: '' - }; - } - render() { - return /*#__PURE__*/React.createElement(View, { - style: { - padding: 10 - } - }, /*#__PURE__*/React.createElement(TextInput, { - style: { - backgroundColor: '#000', - color: '#eee', - padding: 8 - }, - placeholder: \\"Type here to translate!\\" // not supported on iOS - , - onChangeText: text => this.setState({ - text - }), - value: this.state.text, - dataSentryElement: \\"TextInput\\", - dataSentrySourceFile: \\"filename-test.js\\" - }), /*#__PURE__*/React.createElement(Text, { - style: { - padding: 10, - fontSize: 42 - }, - dataSentryElement: \\"Text\\", - dataSentrySourceFile: \\"filename-test.js\\" - }, this.state.text.split(' ').map(word => word && '🍕').join(' '))); - } - } - export default function App() { - return /*#__PURE__*/React.createElement(View, { - style: styles.container - }, /*#__PURE__*/React.createElement(Text, { - style: { - color: '#eee' - }, - dataSentryElement: \\"Text\\", - dataSentrySourceFile: \\"filename-test.js\\" - }, \\"FullStory ReactNative testing app\\"), /*#__PURE__*/React.createElement(Bananas, { - dataSentryElement: \\"Bananas\\", - dataSentrySourceFile: \\"filename-test.js\\" - }), /*#__PURE__*/React.createElement(PizzaTranslator, { - dataSentryElement: \\"PizzaTranslator\\", - dataSentrySourceFile: \\"filename-test.js\\" - })); - } - const styles = StyleSheet.create({ - container: { - flex: 1, - justifyContent: 'center', - alignItems: 'stretch', - backgroundColor: '#222', - alignItems: 'center', - justifyContent: 'center' - } - });" - `); -}); - -it("Bananas/Pizza/App only Pizza dataSentrySourceFile=match dataSentryComponent=match dataSentryElement=match snapshot matches", () => { - const result = transform(BananasPizzaAppStandardInput, { - filename: "/filename-test.js", - configFile: false, - presets: ["@babel/preset-react"], - plugins: [ - [ - plugin, - { - native: true, - ignoreComponents: [ - // Bananas - ["filename-test.js", "Bananas", "Image"], - // App - ["filename-test.js", "App", "View"], - ], - }, - ], - ], - }); - expect(result?.code).toMatchInlineSnapshot(` - "import React, { Component } from 'react'; - import { StyleSheet, Text, TextInput, View, Image, UIManager } from 'react-native'; - UIManager.getViewManagerConfig('RCTView').NativeProps.fsClass = \\"String\\"; - class Bananas extends Component { - render() { - let pic = { - uri: 'https://upload.wikimedia.org/wikipedia/commons/d/de/Bananavarieties.jpg' - }; - return /*#__PURE__*/React.createElement(Image, { - source: pic, - style: { - width: 193, - height: 110, - marginTop: 10 - }, - fsClass: \\"test-class\\" - }); - } - } - class PizzaTranslator extends Component { - constructor(props) { - super(props); - this.state = { - text: '' - }; - } - render() { - return /*#__PURE__*/React.createElement(View, { - style: { - padding: 10 - }, - dataSentryElement: \\"View\\", - dataSentryComponent: \\"PizzaTranslator\\", - dataSentrySourceFile: \\"filename-test.js\\" - }, /*#__PURE__*/React.createElement(TextInput, { - style: { - backgroundColor: '#000', - color: '#eee', - padding: 8 - }, - placeholder: \\"Type here to translate!\\" // not supported on iOS - , - onChangeText: text => this.setState({ - text - }), - value: this.state.text, - dataSentryElement: \\"TextInput\\", - dataSentrySourceFile: \\"filename-test.js\\" - }), /*#__PURE__*/React.createElement(Text, { - style: { - padding: 10, - fontSize: 42 - }, - dataSentryElement: \\"Text\\", - dataSentrySourceFile: \\"filename-test.js\\" - }, this.state.text.split(' ').map(word => word && '🍕').join(' '))); - } - } - export default function App() { - return /*#__PURE__*/React.createElement(View, { - style: styles.container - }, /*#__PURE__*/React.createElement(Text, { - style: { - color: '#eee' - }, - dataSentryElement: \\"Text\\", - dataSentrySourceFile: \\"filename-test.js\\" - }, \\"FullStory ReactNative testing app\\"), /*#__PURE__*/React.createElement(Bananas, { - dataSentryElement: \\"Bananas\\", - dataSentrySourceFile: \\"filename-test.js\\" - }), /*#__PURE__*/React.createElement(PizzaTranslator, { - dataSentryElement: \\"PizzaTranslator\\", - dataSentrySourceFile: \\"filename-test.js\\" - })); - } - const styles = StyleSheet.create({ - container: { - flex: 1, - justifyContent: 'center', - alignItems: 'stretch', - backgroundColor: '#222', - alignItems: 'center', - justifyContent: 'center' - } - });" - `); -}); - -it("Bananas/Pizza/App only App dataSentrySourceFile=match dataSentryComponent=match dataSentryElement=match snapshot matches", () => { - const result = transform(BananasPizzaAppStandardInput, { - filename: "/filename-test.js", - configFile: false, - presets: ["@babel/preset-react"], - plugins: [ - [ - plugin, - { - native: true, - ignoreComponents: [ - // Bananas - ["filename-test.js", "Bananas", "Image"], - // Pizza - ["filename-test.js", "PizzaTranslator", "View"], - ], - }, - ], - ], - }); - expect(result?.code).toMatchInlineSnapshot(` - "import React, { Component } from 'react'; - import { StyleSheet, Text, TextInput, View, Image, UIManager } from 'react-native'; - UIManager.getViewManagerConfig('RCTView').NativeProps.fsClass = \\"String\\"; - class Bananas extends Component { - render() { - let pic = { - uri: 'https://upload.wikimedia.org/wikipedia/commons/d/de/Bananavarieties.jpg' - }; - return /*#__PURE__*/React.createElement(Image, { - source: pic, - style: { - width: 193, - height: 110, - marginTop: 10 - }, - fsClass: \\"test-class\\" - }); - } - } - class PizzaTranslator extends Component { - constructor(props) { - super(props); - this.state = { - text: '' - }; - } - render() { - return /*#__PURE__*/React.createElement(View, { - style: { - padding: 10 - } - }, /*#__PURE__*/React.createElement(TextInput, { - style: { - backgroundColor: '#000', - color: '#eee', - padding: 8 - }, - placeholder: \\"Type here to translate!\\" // not supported on iOS - , - onChangeText: text => this.setState({ - text - }), - value: this.state.text, - dataSentryElement: \\"TextInput\\", - dataSentrySourceFile: \\"filename-test.js\\" - }), /*#__PURE__*/React.createElement(Text, { - style: { - padding: 10, - fontSize: 42 - }, - dataSentryElement: \\"Text\\", - dataSentrySourceFile: \\"filename-test.js\\" - }, this.state.text.split(' ').map(word => word && '🍕').join(' '))); - } - } - export default function App() { - return /*#__PURE__*/React.createElement(View, { - style: styles.container, - dataSentryElement: \\"View\\", - dataSentryComponent: \\"App\\", - dataSentrySourceFile: \\"filename-test.js\\" - }, /*#__PURE__*/React.createElement(Text, { - style: { - color: '#eee' - }, - dataSentryElement: \\"Text\\", - dataSentrySourceFile: \\"filename-test.js\\" - }, \\"FullStory ReactNative testing app\\"), /*#__PURE__*/React.createElement(Bananas, { - dataSentryElement: \\"Bananas\\", - dataSentrySourceFile: \\"filename-test.js\\" - }), /*#__PURE__*/React.createElement(PizzaTranslator, { - dataSentryElement: \\"PizzaTranslator\\", - dataSentrySourceFile: \\"filename-test.js\\" - })); - } - const styles = StyleSheet.create({ - container: { - flex: 1, - justifyContent: 'center', - alignItems: 'stretch', - backgroundColor: '#222', - alignItems: 'center', - justifyContent: 'center' - } - });" - `); -}); - -it("Bananas/Pizza/App No Pizza Elements dataSentrySourceFile=match dataSentryComponent=match dataSentryElement=match snapshot matches", () => { - const result = transform(BananasPizzaAppStandardInput, { - filename: "/filename-test.js", - configFile: false, - presets: ["@babel/preset-react"], - plugins: [ - [ - plugin, - { - native: true, - ignoreComponents: [ - // Pizza Element - ["filename-test.js", null, "PizzaTranslator"], - ], - }, - ], - ], - }); - expect(result?.code).toMatchInlineSnapshot(` - "import React, { Component } from 'react'; - import { StyleSheet, Text, TextInput, View, Image, UIManager } from 'react-native'; - UIManager.getViewManagerConfig('RCTView').NativeProps.fsClass = \\"String\\"; - class Bananas extends Component { - render() { - let pic = { - uri: 'https://upload.wikimedia.org/wikipedia/commons/d/de/Bananavarieties.jpg' - }; - return /*#__PURE__*/React.createElement(Image, { - source: pic, - style: { - width: 193, - height: 110, - marginTop: 10 - }, - fsClass: \\"test-class\\", - dataSentryElement: \\"Image\\", - dataSentryComponent: \\"Bananas\\", - dataSentrySourceFile: \\"filename-test.js\\" - }); - } - } - class PizzaTranslator extends Component { - constructor(props) { - super(props); - this.state = { - text: '' - }; - } - render() { - return /*#__PURE__*/React.createElement(View, { - style: { - padding: 10 - }, - dataSentryElement: \\"View\\", - dataSentryComponent: \\"PizzaTranslator\\", - dataSentrySourceFile: \\"filename-test.js\\" - }, /*#__PURE__*/React.createElement(TextInput, { - style: { - backgroundColor: '#000', - color: '#eee', - padding: 8 - }, - placeholder: \\"Type here to translate!\\" // not supported on iOS - , - onChangeText: text => this.setState({ - text - }), - value: this.state.text, - dataSentryElement: \\"TextInput\\", - dataSentrySourceFile: \\"filename-test.js\\" - }), /*#__PURE__*/React.createElement(Text, { - style: { - padding: 10, - fontSize: 42 - }, - dataSentryElement: \\"Text\\", - dataSentrySourceFile: \\"filename-test.js\\" - }, this.state.text.split(' ').map(word => word && '🍕').join(' '))); - } - } - export default function App() { - return /*#__PURE__*/React.createElement(View, { - style: styles.container, - dataSentryElement: \\"View\\", - dataSentryComponent: \\"App\\", - dataSentrySourceFile: \\"filename-test.js\\" - }, /*#__PURE__*/React.createElement(Text, { - style: { - color: '#eee' - }, - dataSentryElement: \\"Text\\", - dataSentrySourceFile: \\"filename-test.js\\" - }, \\"FullStory ReactNative testing app\\"), /*#__PURE__*/React.createElement(Bananas, { - dataSentryElement: \\"Bananas\\", - dataSentrySourceFile: \\"filename-test.js\\" - }), /*#__PURE__*/React.createElement(PizzaTranslator, null)); - } - const styles = StyleSheet.create({ - container: { - flex: 1, - justifyContent: 'center', - alignItems: 'stretch', - backgroundColor: '#222', - alignItems: 'center', - justifyContent: 'center' - } - });" - `); -}); - it("Bananas/Pizza/App No Bananas Elements dataSentrySourceFile=match dataSentryComponent=match dataSentryElement=match snapshot matches", () => { const result = transform(BananasPizzaAppStandardInput, { filename: "/filename-test.js", From 8636c67036dbf3946253f986713a731e555cb66c Mon Sep 17 00:00:00 2001 From: Ash Anand Date: Mon, 6 Jan 2025 14:52:23 -0500 Subject: [PATCH 07/12] remove more redundant tests --- .../test/test-plugin.test.ts | 220 ------------------ 1 file changed, 220 deletions(-) diff --git a/packages/babel-plugin-component-annotate/test/test-plugin.test.ts b/packages/babel-plugin-component-annotate/test/test-plugin.test.ts index 6790b933..e1055c80 100644 --- a/packages/babel-plugin-component-annotate/test/test-plugin.test.ts +++ b/packages/babel-plugin-component-annotate/test/test-plugin.test.ts @@ -1305,226 +1305,6 @@ it("Bananas ignore components dataSentrySourceFile=* dataSentryComponent=* dataS `); }); -it("Bananas/Pizza/App No Bananas Elements dataSentrySourceFile=match dataSentryComponent=match dataSentryElement=match snapshot matches", () => { - const result = transform(BananasPizzaAppStandardInput, { - filename: "/filename-test.js", - configFile: false, - presets: ["@babel/preset-react"], - plugins: [ - [ - plugin, - { - native: true, - ignoreComponents: [ - // Bananas Element - ["filename-test.js", null, "Bananas"], - ], - }, - ], - ], - }); - - expect(result?.code).toMatchInlineSnapshot(` - "import React, { Component } from 'react'; - import { StyleSheet, Text, TextInput, View, Image, UIManager } from 'react-native'; - UIManager.getViewManagerConfig('RCTView').NativeProps.fsClass = \\"String\\"; - class Bananas extends Component { - render() { - let pic = { - uri: 'https://upload.wikimedia.org/wikipedia/commons/d/de/Bananavarieties.jpg' - }; - return /*#__PURE__*/React.createElement(Image, { - source: pic, - style: { - width: 193, - height: 110, - marginTop: 10 - }, - fsClass: \\"test-class\\", - dataSentryElement: \\"Image\\", - dataSentryComponent: \\"Bananas\\", - dataSentrySourceFile: \\"filename-test.js\\" - }); - } - } - class PizzaTranslator extends Component { - constructor(props) { - super(props); - this.state = { - text: '' - }; - } - render() { - return /*#__PURE__*/React.createElement(View, { - style: { - padding: 10 - }, - dataSentryElement: \\"View\\", - dataSentryComponent: \\"PizzaTranslator\\", - dataSentrySourceFile: \\"filename-test.js\\" - }, /*#__PURE__*/React.createElement(TextInput, { - style: { - backgroundColor: '#000', - color: '#eee', - padding: 8 - }, - placeholder: \\"Type here to translate!\\" // not supported on iOS - , - onChangeText: text => this.setState({ - text - }), - value: this.state.text, - dataSentryElement: \\"TextInput\\", - dataSentrySourceFile: \\"filename-test.js\\" - }), /*#__PURE__*/React.createElement(Text, { - style: { - padding: 10, - fontSize: 42 - }, - dataSentryElement: \\"Text\\", - dataSentrySourceFile: \\"filename-test.js\\" - }, this.state.text.split(' ').map(word => word && '🍕').join(' '))); - } - } - export default function App() { - return /*#__PURE__*/React.createElement(View, { - style: styles.container, - dataSentryElement: \\"View\\", - dataSentryComponent: \\"App\\", - dataSentrySourceFile: \\"filename-test.js\\" - }, /*#__PURE__*/React.createElement(Text, { - style: { - color: '#eee' - }, - dataSentryElement: \\"Text\\", - dataSentrySourceFile: \\"filename-test.js\\" - }, \\"FullStory ReactNative testing app\\"), /*#__PURE__*/React.createElement(Bananas, null), /*#__PURE__*/React.createElement(PizzaTranslator, { - dataSentryElement: \\"PizzaTranslator\\", - dataSentrySourceFile: \\"filename-test.js\\" - })); - } - const styles = StyleSheet.create({ - container: { - flex: 1, - justifyContent: 'center', - alignItems: 'stretch', - backgroundColor: '#222', - alignItems: 'center', - justifyContent: 'center' - } - });" - `); -}); - -it("Bananas/Pizza/App No Bananas/Pizza Elements dataSentrySourceFile=match dataSentryComponent=match dataSentryElement=match snapshot matches", () => { - const result = transform(BananasPizzaAppStandardInput, { - filename: "/filename-test.js", - configFile: false, - presets: ["@babel/preset-react"], - plugins: [ - [ - plugin, - { - native: true, - ignoreComponents: [ - // Bananas Element - ["filename-test.js", null, "Bananas"], - // Pizza Element - ["filename-test.js", null, "PizzaTranslator"], - ], - }, - ], - ], - }); - expect(result?.code).toMatchInlineSnapshot(` - "import React, { Component } from 'react'; - import { StyleSheet, Text, TextInput, View, Image, UIManager } from 'react-native'; - UIManager.getViewManagerConfig('RCTView').NativeProps.fsClass = \\"String\\"; - class Bananas extends Component { - render() { - let pic = { - uri: 'https://upload.wikimedia.org/wikipedia/commons/d/de/Bananavarieties.jpg' - }; - return /*#__PURE__*/React.createElement(Image, { - source: pic, - style: { - width: 193, - height: 110, - marginTop: 10 - }, - fsClass: \\"test-class\\", - dataSentryElement: \\"Image\\", - dataSentryComponent: \\"Bananas\\", - dataSentrySourceFile: \\"filename-test.js\\" - }); - } - } - class PizzaTranslator extends Component { - constructor(props) { - super(props); - this.state = { - text: '' - }; - } - render() { - return /*#__PURE__*/React.createElement(View, { - style: { - padding: 10 - }, - dataSentryElement: \\"View\\", - dataSentryComponent: \\"PizzaTranslator\\", - dataSentrySourceFile: \\"filename-test.js\\" - }, /*#__PURE__*/React.createElement(TextInput, { - style: { - backgroundColor: '#000', - color: '#eee', - padding: 8 - }, - placeholder: \\"Type here to translate!\\" // not supported on iOS - , - onChangeText: text => this.setState({ - text - }), - value: this.state.text, - dataSentryElement: \\"TextInput\\", - dataSentrySourceFile: \\"filename-test.js\\" - }), /*#__PURE__*/React.createElement(Text, { - style: { - padding: 10, - fontSize: 42 - }, - dataSentryElement: \\"Text\\", - dataSentrySourceFile: \\"filename-test.js\\" - }, this.state.text.split(' ').map(word => word && '🍕').join(' '))); - } - } - export default function App() { - return /*#__PURE__*/React.createElement(View, { - style: styles.container, - dataSentryElement: \\"View\\", - dataSentryComponent: \\"App\\", - dataSentrySourceFile: \\"filename-test.js\\" - }, /*#__PURE__*/React.createElement(Text, { - style: { - color: '#eee' - }, - dataSentryElement: \\"Text\\", - dataSentrySourceFile: \\"filename-test.js\\" - }, \\"FullStory ReactNative testing app\\"), /*#__PURE__*/React.createElement(Bananas, null), /*#__PURE__*/React.createElement(PizzaTranslator, null)); - } - const styles = StyleSheet.create({ - container: { - flex: 1, - justifyContent: 'center', - alignItems: 'stretch', - backgroundColor: '#222', - alignItems: 'center', - justifyContent: 'center' - } - });" - `); -}); - it("Bananas incompatible plugin @react-navigation source snapshot matches", () => { const result = transform(BananasStandardInput, { filename: "test/node_modules/@react-navigation/core/filename-test.js", From 0e8c3296beb1c0baa93c8bca49e4590c9dba87e2 Mon Sep 17 00:00:00 2001 From: Ash Anand Date: Mon, 6 Jan 2025 17:11:31 -0500 Subject: [PATCH 08/12] remove remaining redundant tests --- .../test/test-plugin.test.ts | 285 ++++-------------- 1 file changed, 63 insertions(+), 222 deletions(-) diff --git a/packages/babel-plugin-component-annotate/test/test-plugin.test.ts b/packages/babel-plugin-component-annotate/test/test-plugin.test.ts index e1055c80..a4bb454d 100644 --- a/packages/babel-plugin-component-annotate/test/test-plugin.test.ts +++ b/packages/babel-plugin-component-annotate/test/test-plugin.test.ts @@ -1051,44 +1051,11 @@ export default PureComponentName; expect(result?.code).toMatchSnapshot(); }); -it("Bananas ignore components dataSentrySourceFile=nomatch dataSentryComponent=nomatch dataSentryElement=nomatch snapshot matches", () => { - const result = transform(BananasStandardInput, { - filename: "/filename-test.js", - configFile: false, - presets: ["@babel/preset-react"], - plugins: [[plugin, { native: true, ignoreComponents: [["nomatch.js", "nomatch", "nomatch"]] }]], - }); - expect(result?.code).toMatchInlineSnapshot(` - "import React, { Component } from 'react'; - import { Image } from 'react-native'; - class Bananas extends Component { - render() { - let pic = { - uri: 'https://upload.wikimedia.org/wikipedia/commons/d/de/Bananavarieties.jpg' - }; - return /*#__PURE__*/React.createElement(Image, { - source: pic, - style: { - width: 193, - height: 110, - marginTop: 10 - }, - fsClass: \\"test-class\\", - dataSentryElement: \\"Image\\", - dataSentryComponent: \\"Bananas\\", - dataSentrySourceFile: \\"filename-test.js\\" - }); - } - }" - `); -}); - -it("ignore components dataSentrySourceFile=* dataSentryComponent=nomatch dataSentryElement=nomatch snapshot matches", () => { +it("Bananas incompatible plugin @react-navigation source snapshot matches", () => { const result = transform(BananasStandardInput, { - filename: "/filename-test.js", - configFile: false, + filename: "test/node_modules/@react-navigation/core/filename-test.js", presets: ["@babel/preset-react"], - plugins: [[plugin, { native: true, ignoreComponents: [["*", "nomatch", "nomatch"]] }]], + plugins: [[plugin, { native: true }]], }); expect(result?.code).toMatchInlineSnapshot(` "import React, { Component } from 'react'; @@ -1105,26 +1072,23 @@ it("ignore components dataSentrySourceFile=* dataSentryComponent=nomatch dataSen height: 110, marginTop: 10 }, - fsClass: \\"test-class\\", - dataSentryElement: \\"Image\\", - dataSentryComponent: \\"Bananas\\", - dataSentrySourceFile: \\"filename-test.js\\" + fsClass: \\"test-class\\" }); } }" `); }); -it("Bananas ignore components dataSentrySourceFile=nomatch dataSentryComponent=* dataSentryElement=nomatch snapshot matches", () => { - const result = transform(BananasStandardInput, { +it("skips components marked in ignoreComponents", () => { + const result = transform(BananasPizzaAppStandardInput, { filename: "/filename-test.js", - configFile: false, presets: ["@babel/preset-react"], - plugins: [[plugin, { native: true, ignoreComponents: [["nomatch.js", "*", "nomatch"]] }]], + plugins: [[plugin, { native: true, ignoreComponents: ["Bananas"] }]], }); expect(result?.code).toMatchInlineSnapshot(` "import React, { Component } from 'react'; - import { Image } from 'react-native'; + import { StyleSheet, Text, TextInput, View, Image, UIManager } from 'react-native'; + UIManager.getViewManagerConfig('RCTView').NativeProps.fsClass = \\"String\\"; class Bananas extends Component { render() { let pic = { @@ -1137,198 +1101,75 @@ it("Bananas ignore components dataSentrySourceFile=nomatch dataSentryComponent=* height: 110, marginTop: 10 }, - fsClass: \\"test-class\\", - dataSentryElement: \\"Image\\", - dataSentryComponent: \\"Bananas\\", - dataSentrySourceFile: \\"filename-test.js\\" + fsClass: \\"test-class\\" }); } - }" - `); -}); - -it("Bananas ignore components dataSentrySourceFile=nomatch dataSentryComponent=nomatch dataSentryElement=* snapshot matches", () => { - const result = transform(BananasStandardInput, { - filename: "/filename-test.js", - configFile: false, - presets: ["@babel/preset-react"], - plugins: [[plugin, { native: true, ignoreComponents: [["nomatch.js", "nomatch", "*"]] }]], - }); - expect(result?.code).toMatchInlineSnapshot(` - "import React, { Component } from 'react'; - import { Image } from 'react-native'; - class Bananas extends Component { - render() { - let pic = { - uri: 'https://upload.wikimedia.org/wikipedia/commons/d/de/Bananavarieties.jpg' + } + class PizzaTranslator extends Component { + constructor(props) { + super(props); + this.state = { + text: '' }; - return /*#__PURE__*/React.createElement(Image, { - source: pic, - style: { - width: 193, - height: 110, - marginTop: 10 - }, - fsClass: \\"test-class\\", - dataSentryElement: \\"Image\\", - dataSentryComponent: \\"Bananas\\", - dataSentrySourceFile: \\"filename-test.js\\" - }); } - }" - `); -}); - -it("Bananas ignore components dataSentrySourceFile=* dataSentryComponent=* dataSentryElement=nomatch snapshot matches", () => { - const result = transform(BananasStandardInput, { - filename: "/filename-test.js", - configFile: false, - presets: ["@babel/preset-react"], - plugins: [[plugin, { native: true, ignoreComponents: [["nomatch.js", "nomatch", "nomatch"]] }]], - }); - expect(result?.code).toMatchInlineSnapshot(` - "import React, { Component } from 'react'; - import { Image } from 'react-native'; - class Bananas extends Component { render() { - let pic = { - uri: 'https://upload.wikimedia.org/wikipedia/commons/d/de/Bananavarieties.jpg' - }; - return /*#__PURE__*/React.createElement(Image, { - source: pic, + return /*#__PURE__*/React.createElement(View, { style: { - width: 193, - height: 110, - marginTop: 10 + padding: 10 }, - fsClass: \\"test-class\\", - dataSentryElement: \\"Image\\", - dataSentryComponent: \\"Bananas\\", + dataSentryElement: \\"View\\", + dataSentryComponent: \\"PizzaTranslator\\", dataSentrySourceFile: \\"filename-test.js\\" - }); - } - }" - `); -}); - -it("Bananas ignore components dataSentrySourceFile=* dataSentryComponent=nomatch dataSentryElement=* snapshot matches", () => { - const result = transform(BananasStandardInput, { - filename: "/filename-test.js", - configFile: false, - presets: ["@babel/preset-react"], - plugins: [[plugin, { native: true, ignoreComponents: [["nomatch.js", "nomatch", "nomatch"]] }]], - }); - expect(result?.code).toMatchInlineSnapshot(` - "import React, { Component } from 'react'; - import { Image } from 'react-native'; - class Bananas extends Component { - render() { - let pic = { - uri: 'https://upload.wikimedia.org/wikipedia/commons/d/de/Bananavarieties.jpg' - }; - return /*#__PURE__*/React.createElement(Image, { - source: pic, + }, /*#__PURE__*/React.createElement(TextInput, { style: { - width: 193, - height: 110, - marginTop: 10 + backgroundColor: '#000', + color: '#eee', + padding: 8 }, - fsClass: \\"test-class\\", - dataSentryElement: \\"Image\\", - dataSentryComponent: \\"Bananas\\", + placeholder: \\"Type here to translate!\\" // not supported on iOS + , + onChangeText: text => this.setState({ + text + }), + value: this.state.text, + dataSentryElement: \\"TextInput\\", dataSentrySourceFile: \\"filename-test.js\\" - }); - } - }" - `); -}); - -it("Bananas ignore components dataSentrySourceFile=nomatch dataSentryComponent=* dataSentryElement=* snapshot matches", () => { - const result = transform(BananasStandardInput, { - filename: "/filename-test.js", - configFile: false, - presets: ["@babel/preset-react"], - plugins: [[plugin, { native: true, ignoreComponents: [["nomatch.js", "nomatch", "nomatch"]] }]], - }); - expect(result?.code).toMatchInlineSnapshot(` - "import React, { Component } from 'react'; - import { Image } from 'react-native'; - class Bananas extends Component { - render() { - let pic = { - uri: 'https://upload.wikimedia.org/wikipedia/commons/d/de/Bananavarieties.jpg' - }; - return /*#__PURE__*/React.createElement(Image, { - source: pic, + }), /*#__PURE__*/React.createElement(Text, { style: { - width: 193, - height: 110, - marginTop: 10 + padding: 10, + fontSize: 42 }, - fsClass: \\"test-class\\", - dataSentryElement: \\"Image\\", - dataSentryComponent: \\"Bananas\\", + dataSentryElement: \\"Text\\", dataSentrySourceFile: \\"filename-test.js\\" - }); - } - }" - `); -}); - -// This tests out matching only `dataSentryElement`, with * for the others -it("Bananas ignore components dataSentrySourceFile=* dataSentryComponent=* dataSentryElement=match snapshot matches", () => { - const result = transform(BananasStandardInput, { - filename: "/filename-test.js", - configFile: false, - presets: ["@babel/preset-react"], - plugins: [[plugin, { native: true, ignoreComponents: ["Image"] }]], - }); - expect(result?.code).toMatchInlineSnapshot(` - "import React, { Component } from 'react'; - import { Image } from 'react-native'; - class Bananas extends Component { - render() { - let pic = { - uri: 'https://upload.wikimedia.org/wikipedia/commons/d/de/Bananavarieties.jpg' - }; - return /*#__PURE__*/React.createElement(Image, { - source: pic, - style: { - width: 193, - height: 110, - marginTop: 10 - }, - fsClass: \\"test-class\\" - }); + }, this.state.text.split(' ').map(word => word && '🍕').join(' '))); } - }" - `); -}); - -it("Bananas incompatible plugin @react-navigation source snapshot matches", () => { - const result = transform(BananasStandardInput, { - filename: "test/node_modules/@react-navigation/core/filename-test.js", - presets: ["@babel/preset-react"], - plugins: [[plugin, { native: true }]], - }); - expect(result?.code).toMatchInlineSnapshot(` - "import React, { Component } from 'react'; - import { Image } from 'react-native'; - class Bananas extends Component { - render() { - let pic = { - uri: 'https://upload.wikimedia.org/wikipedia/commons/d/de/Bananavarieties.jpg' - }; - return /*#__PURE__*/React.createElement(Image, { - source: pic, - style: { - width: 193, - height: 110, - marginTop: 10 - }, - fsClass: \\"test-class\\" - }); + } + export default function App() { + return /*#__PURE__*/React.createElement(View, { + style: styles.container, + dataSentryElement: \\"View\\", + dataSentryComponent: \\"App\\", + dataSentrySourceFile: \\"filename-test.js\\" + }, /*#__PURE__*/React.createElement(Text, { + style: { + color: '#eee' + }, + dataSentryElement: \\"Text\\", + dataSentrySourceFile: \\"filename-test.js\\" + }, \\"FullStory ReactNative testing app\\"), /*#__PURE__*/React.createElement(Bananas, null), /*#__PURE__*/React.createElement(PizzaTranslator, { + dataSentryElement: \\"PizzaTranslator\\", + dataSentrySourceFile: \\"filename-test.js\\" + })); + } + const styles = StyleSheet.create({ + container: { + flex: 1, + justifyContent: 'center', + alignItems: 'stretch', + backgroundColor: '#222', + alignItems: 'center', + justifyContent: 'center' } - }" + });" `); }); From 1859fb83ae193d87506c15490720c38de4a3e468 Mon Sep 17 00:00:00 2001 From: Ash Anand Date: Mon, 6 Jan 2025 18:47:14 -0500 Subject: [PATCH 09/12] fix grammar in comments and docs --- packages/babel-plugin-component-annotate/README.md | 2 +- packages/bundler-plugin-core/src/types.ts | 4 ++-- 2 files changed, 3 insertions(+), 3 deletions(-) diff --git a/packages/babel-plugin-component-annotate/README.md b/packages/babel-plugin-component-annotate/README.md index b1fcd255..87d91717 100644 --- a/packages/babel-plugin-component-annotate/README.md +++ b/packages/babel-plugin-component-annotate/README.md @@ -53,7 +53,7 @@ pnpm add @sentry/babel-plugin-component-annotate --save-dev Type: `string[]` -A list of strings representing the names of components to ignore. The plugin will not perform apply `data-sentry` annotations on the DOM element for these components. +A list of strings representing the names of components to ignore. The plugin will not apply `data-sentry` annotations on the DOM element for these components. ## Example diff --git a/packages/bundler-plugin-core/src/types.ts b/packages/bundler-plugin-core/src/types.ts index 5e38f4b5..df9d1d42 100644 --- a/packages/bundler-plugin-core/src/types.ts +++ b/packages/bundler-plugin-core/src/types.ts @@ -320,12 +320,12 @@ export interface Options { */ enabled?: boolean; /** - * A list of strings representing the names of components to ignore. The plugin will not perform any annotations on these components + * A list of strings representing the names of components to ignore. The plugin will not apply `data-sentry` annotations on the DOM element for these components. */ ignoreComponents?: string[]; // TODO: Support this option in the future /** - * A list of strings representing local paths to files to ignore. The plugin will not perform any annotations on components in these files + * A list of strings representing local paths to files to ignore. The plugin will not apply `data-sentry` annotations on components in these files */ // ignoreFiles?: string[]; }; From 8c5de5ecbe72908ebd87f83294f1572244adcd71 Mon Sep 17 00:00:00 2001 From: Ash Anand Date: Mon, 6 Jan 2025 18:52:30 -0500 Subject: [PATCH 10/12] fix lint --- .../src/index.ts | 4 --- .../test/test-plugin.test.ts | 28 ------------------- 2 files changed, 32 deletions(-) diff --git a/packages/babel-plugin-component-annotate/src/index.ts b/packages/babel-plugin-component-annotate/src/index.ts index ee40804d..0e9aab88 100644 --- a/packages/babel-plugin-component-annotate/src/index.ts +++ b/packages/babel-plugin-component-annotate/src/index.ts @@ -496,10 +496,6 @@ function isReactFragment(t: typeof Babel.types, openingElement: Babel.NodePath): return false; } -function matchesIgnoreRule(rule: string, name: string | undefined | null) { - return rule === "*" || rule === name; -} - function hasAttributeWithName( openingElement: Babel.NodePath, name: string | undefined | null diff --git a/packages/babel-plugin-component-annotate/test/test-plugin.test.ts b/packages/babel-plugin-component-annotate/test/test-plugin.test.ts index c3e4a7ee..e5d64f06 100644 --- a/packages/babel-plugin-component-annotate/test/test-plugin.test.ts +++ b/packages/babel-plugin-component-annotate/test/test-plugin.test.ts @@ -1174,34 +1174,6 @@ it("skips components marked in ignoreComponents", () => { `); }); -it("Bananas incompatible plugin @react-navigation source snapshot matches", () => { - const result = transform(BananasStandardInput, { - filename: "test/node_modules/@react-navigation/core/filename-test.js", - presets: ["@babel/preset-react"], - plugins: [[plugin, { native: true }]], - }); - expect(result?.code).toMatchInlineSnapshot(` - "import React, { Component } from 'react'; - import { Image } from 'react-native'; - class Bananas extends Component { - render() { - let pic = { - uri: 'https://upload.wikimedia.org/wikipedia/commons/d/de/Bananavarieties.jpg' - }; - return /*#__PURE__*/React.createElement(Image, { - source: pic, - style: { - width: 193, - height: 110, - marginTop: 10 - }, - fsClass: \\"test-class\\" - }); - } - }" - `); -}); - it("handles ternary operation returned by function body", () => { const result = transform( `const maybeTrue = Math.random() > 0.5; From 15444f53cbe1d32f0105f516860cd77f58c6bb9d Mon Sep 17 00:00:00 2001 From: Ash Anand Date: Wed, 8 Jan 2025 11:11:19 -0500 Subject: [PATCH 11/12] renamed `ignoreComponents` to `ignoredComponents` --- packages/babel-plugin-component-annotate/README.md | 4 ++-- packages/babel-plugin-component-annotate/src/index.ts | 8 ++++---- .../test/test-plugin.test.ts | 4 ++-- packages/bundler-plugin-core/src/index.ts | 8 ++++---- packages/bundler-plugin-core/src/types.ts | 2 +- packages/dev-utils/src/generate-documentation-table.ts | 2 +- packages/rollup-plugin/src/index.ts | 4 ++-- packages/vite-plugin/src/index.ts | 4 ++-- packages/webpack-plugin/src/index.ts | 4 ++-- 9 files changed, 20 insertions(+), 20 deletions(-) diff --git a/packages/babel-plugin-component-annotate/README.md b/packages/babel-plugin-component-annotate/README.md index 87d91717..7783c758 100644 --- a/packages/babel-plugin-component-annotate/README.md +++ b/packages/babel-plugin-component-annotate/README.md @@ -49,7 +49,7 @@ pnpm add @sentry/babel-plugin-component-annotate --save-dev ## Options -### `ignoreComponents` +### `ignoredComponents` Type: `string[]` @@ -66,7 +66,7 @@ A list of strings representing the names of components to ignore. The plugin wil plugins: [ // Put this plugin before any other plugins you have that transform JSX code // The options are set by providing an object as the second element in the array, but not required - ['@sentry/babel-plugin-component-annotate', {ignoreComponents: ['Foo', 'Bar']}] + ['@sentry/babel-plugin-component-annotate', {ignoredComponents: ['Foo', 'Bar']}] ], } ``` diff --git a/packages/babel-plugin-component-annotate/src/index.ts b/packages/babel-plugin-component-annotate/src/index.ts index 0e9aab88..0cd087d9 100644 --- a/packages/babel-plugin-component-annotate/src/index.ts +++ b/packages/babel-plugin-component-annotate/src/index.ts @@ -48,7 +48,7 @@ const nativeSourceFileName = "dataSentrySourceFile"; interface AnnotationOpts { native?: boolean; "annotate-fragments"?: boolean; - ignoreComponents?: string[]; + ignoredComponents?: string[]; } interface AnnotationPluginPass extends PluginPass { @@ -76,7 +76,7 @@ export default function componentNameAnnotatePlugin({ types: t }: typeof Babel): path.node.id.name, sourceFileNameFromState(state), attributeNamesFromState(state), - state.opts.ignoreComponents ?? [] + state.opts.ignoredComponents ?? [] ); }, ArrowFunctionExpression(path, state) { @@ -104,7 +104,7 @@ export default function componentNameAnnotatePlugin({ types: t }: typeof Babel): parent.id.name, sourceFileNameFromState(state), attributeNamesFromState(state), - state.opts.ignoreComponents ?? [] + state.opts.ignoredComponents ?? [] ); }, ClassDeclaration(path, state) { @@ -118,7 +118,7 @@ export default function componentNameAnnotatePlugin({ types: t }: typeof Babel): return; } - const ignoredComponents = state.opts.ignoreComponents ?? []; + const ignoredComponents = state.opts.ignoredComponents ?? []; render.traverse({ ReturnStatement(returnStatement) { diff --git a/packages/babel-plugin-component-annotate/test/test-plugin.test.ts b/packages/babel-plugin-component-annotate/test/test-plugin.test.ts index e5d64f06..7dce87ad 100644 --- a/packages/babel-plugin-component-annotate/test/test-plugin.test.ts +++ b/packages/babel-plugin-component-annotate/test/test-plugin.test.ts @@ -1079,11 +1079,11 @@ it("Bananas incompatible plugin @react-navigation source snapshot matches", () = `); }); -it("skips components marked in ignoreComponents", () => { +it("skips components marked in ignoredComponents", () => { const result = transform(BananasPizzaAppStandardInput, { filename: "/filename-test.js", presets: ["@babel/preset-react"], - plugins: [[plugin, { native: true, ignoreComponents: ["Bananas"] }]], + plugins: [[plugin, { native: true, ignoredComponents: ["Bananas"] }]], }); expect(result?.code).toMatchInlineSnapshot(` "import React, { Component } from 'react'; diff --git a/packages/bundler-plugin-core/src/index.ts b/packages/bundler-plugin-core/src/index.ts index dd379b86..dc7006dc 100644 --- a/packages/bundler-plugin-core/src/index.ts +++ b/packages/bundler-plugin-core/src/index.ts @@ -30,7 +30,7 @@ import { closeSession, DEFAULT_ENVIRONMENT, makeSession } from "@sentry/core"; interface SentryUnpluginFactoryOptions { releaseInjectionPlugin: (injectionCode: string) => UnpluginOptions; - componentNameAnnotatePlugin?: (ignoreComponents?: string[]) => UnpluginOptions; + componentNameAnnotatePlugin?: (ignoredComponents?: string[]) => UnpluginOptions; moduleMetadataInjectionPlugin: (injectionCode: string) => UnpluginOptions; debugIdInjectionPlugin: (logger: Logger) => UnpluginOptions; debugIdUploadPlugin: (upload: (buildArtifacts: string[]) => Promise) => UnpluginOptions; @@ -425,7 +425,7 @@ export function sentryUnpluginFactory({ } else { componentNameAnnotatePlugin && plugins.push( - componentNameAnnotatePlugin(options.reactComponentAnnotation.ignoreComponents) + componentNameAnnotatePlugin(options.reactComponentAnnotation.ignoredComponents) ); } } @@ -648,7 +648,7 @@ export function createRollupDebugIdUploadHooks( }; } -export function createComponentNameAnnotateHooks(ignoreComponents?: string[]) { +export function createComponentNameAnnotateHooks(ignoredComponents?: string[]) { type ParserPlugins = NonNullable< NonNullable[1]>["parserOpts"] >["plugins"]; @@ -676,7 +676,7 @@ export function createComponentNameAnnotateHooks(ignoreComponents?: string[]) { try { const result = await transformAsync(code, { - plugins: [[componentNameAnnotatePlugin, { ignoreComponents }]], + plugins: [[componentNameAnnotatePlugin, { ignoredComponents }]], filename: id, parserOpts: { sourceType: "module", diff --git a/packages/bundler-plugin-core/src/types.ts b/packages/bundler-plugin-core/src/types.ts index df9d1d42..0371f188 100644 --- a/packages/bundler-plugin-core/src/types.ts +++ b/packages/bundler-plugin-core/src/types.ts @@ -322,7 +322,7 @@ export interface Options { /** * A list of strings representing the names of components to ignore. The plugin will not apply `data-sentry` annotations on the DOM element for these components. */ - ignoreComponents?: string[]; + ignoredComponents?: string[]; // TODO: Support this option in the future /** * A list of strings representing local paths to files to ignore. The plugin will not apply `data-sentry` annotations on components in these files diff --git a/packages/dev-utils/src/generate-documentation-table.ts b/packages/dev-utils/src/generate-documentation-table.ts index e4ff9f5b..8cf1e2e2 100644 --- a/packages/dev-utils/src/generate-documentation-table.ts +++ b/packages/dev-utils/src/generate-documentation-table.ts @@ -391,7 +391,7 @@ type IncludeEntry = { supportedBundlers: ["webpack", "vite", "rollup"], }, { - name: "ignoreComponents", + name: "ignoredComponents", type: "string[]", fullDescription: "A list of strings representing the names of components to ignore. The plugin will not perform apply `data-sentry` annotations on the DOM element for these components.", diff --git a/packages/rollup-plugin/src/index.ts b/packages/rollup-plugin/src/index.ts index 9a7d24ec..de29484f 100644 --- a/packages/rollup-plugin/src/index.ts +++ b/packages/rollup-plugin/src/index.ts @@ -18,10 +18,10 @@ function rollupReleaseInjectionPlugin(injectionCode: string): UnpluginOptions { }; } -function rollupComponentNameAnnotatePlugin(ignoreComponents?: string[]): UnpluginOptions { +function rollupComponentNameAnnotatePlugin(ignoredComponents?: string[]): UnpluginOptions { return { name: "sentry-rollup-component-name-annotate-plugin", - rollup: createComponentNameAnnotateHooks(ignoreComponents), + rollup: createComponentNameAnnotateHooks(ignoredComponents), }; } diff --git a/packages/vite-plugin/src/index.ts b/packages/vite-plugin/src/index.ts index c757819d..11c77f00 100644 --- a/packages/vite-plugin/src/index.ts +++ b/packages/vite-plugin/src/index.ts @@ -21,11 +21,11 @@ function viteReleaseInjectionPlugin(injectionCode: string): UnpluginOptions { }; } -function viteComponentNameAnnotatePlugin(ignoreComponents?: string[]): UnpluginOptions { +function viteComponentNameAnnotatePlugin(ignoredComponents?: string[]): UnpluginOptions { return { name: "sentry-vite-component-name-annotate-plugin", enforce: "pre" as const, - vite: createComponentNameAnnotateHooks(ignoreComponents), + vite: createComponentNameAnnotateHooks(ignoredComponents), }; } diff --git a/packages/webpack-plugin/src/index.ts b/packages/webpack-plugin/src/index.ts index 9a956e62..f215630c 100644 --- a/packages/webpack-plugin/src/index.ts +++ b/packages/webpack-plugin/src/index.ts @@ -47,7 +47,7 @@ function webpackReleaseInjectionPlugin(injectionCode: string): UnpluginOptions { }; } -function webpackComponentNameAnnotatePlugin(ignoreComponents?: string[]): UnpluginOptions { +function webpackComponentNameAnnotatePlugin(ignoredComponents?: string[]): UnpluginOptions { return { name: "sentry-webpack-component-name-annotate-plugin", enforce: "pre", @@ -55,7 +55,7 @@ function webpackComponentNameAnnotatePlugin(ignoreComponents?: string[]): Unplug transformInclude(id) { return id.endsWith(".tsx") || id.endsWith(".jsx"); }, - transform: createComponentNameAnnotateHooks(ignoreComponents).transform, + transform: createComponentNameAnnotateHooks(ignoredComponents).transform, }; } From e9042a532e718cfaab57614bd650163cae2fd961 Mon Sep 17 00:00:00 2001 From: Ash Anand Date: Wed, 8 Jan 2025 11:12:48 -0500 Subject: [PATCH 12/12] remove todo comments --- packages/bundler-plugin-core/src/types.ts | 5 ----- packages/dev-utils/src/generate-documentation-table.ts | 8 -------- 2 files changed, 13 deletions(-) diff --git a/packages/bundler-plugin-core/src/types.ts b/packages/bundler-plugin-core/src/types.ts index 0371f188..b6b5052e 100644 --- a/packages/bundler-plugin-core/src/types.ts +++ b/packages/bundler-plugin-core/src/types.ts @@ -323,11 +323,6 @@ export interface Options { * A list of strings representing the names of components to ignore. The plugin will not apply `data-sentry` annotations on the DOM element for these components. */ ignoredComponents?: string[]; - // TODO: Support this option in the future - /** - * A list of strings representing local paths to files to ignore. The plugin will not apply `data-sentry` annotations on components in these files - */ - // ignoreFiles?: string[]; }; /** diff --git a/packages/dev-utils/src/generate-documentation-table.ts b/packages/dev-utils/src/generate-documentation-table.ts index 8cf1e2e2..bd56e487 100644 --- a/packages/dev-utils/src/generate-documentation-table.ts +++ b/packages/dev-utils/src/generate-documentation-table.ts @@ -397,14 +397,6 @@ type IncludeEntry = { "A list of strings representing the names of components to ignore. The plugin will not perform apply `data-sentry` annotations on the DOM element for these components.", supportedBundlers: ["webpack", "vite", "rollup"], }, - // TODO: Support this option in the future - // { - // name: "ignoreFiles", - // type: "string[]", - // fullDescription: - // "A list of strings representing local paths to files to ignore. The plugin will not perform any annotations on components in these files.", - // supportedBundlers: ["webpack", "vite", "rollup"], - // }, ], }, {