@dynatrace/react-native-plugin 2.331.1 → 2.333.1

package/lib/features/ui-interaction/Plugin.js

@@ -0,0 +1,945 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.applyDTUserInteraction = void 0;
+const fs = require("fs");
+const path = require("path");
+const micromatch_1 = require("micromatch");
+const jsc = require("jscodeshift");
+const Types_1 = require("./Types");
+const STOP_IDS_BASE = Object.values(Types_1.StopId).filter((x) => x !== Types_1.StopId.Segment && x !== Types_1.StopId.TabButton);
+const STOP_MEMBER_BASE = Object.values(Types_1.StopMemberBase);
+const TAB_BASE = Object.values(Types_1.TabBase);
+const STOP_MEMBER_PROPS = Object.values(Types_1.StopMemberProp);
+const DANGEROUS_WRAP_DENY = Object.values(Types_1.DangerousWrapDeny);
+const PRESS_KEYS = Object.values(Types_1.PressKey);
+const NODE_MODULES_UI_TAGS = [
+    'View',
+    'Text',
+    'Image',
+    'ScrollView',
+    'FlatList',
+    'SectionList',
+    'Pressable',
+    'TouchableOpacity',
+    'TouchableHighlight',
+    'TouchableWithoutFeedback',
+    'TouchableNativeFeedback',
+    'Modal',
+    'SafeAreaView',
+    'PlatformPressable',
+];
+const PATH_PREFIX_DEFAULT_NAME = 'PathPrefix';
+const isPathInside = (baseDir, candidatePath) => {
+    const resolvedBase = path.resolve(baseDir);
+    const resolvedCandidate = path.resolve(candidatePath);
+    return (resolvedCandidate === resolvedBase ||
+        resolvedCandidate.startsWith(`${resolvedBase}${path.sep}`));
+};
+var GestureParentName;
+(function (GestureParentName) {
+    GestureParentName["PanGestureHandler"] = "PanGestureHandler";
+    GestureParentName["TapGestureHandler"] = "TapGestureHandler";
+    GestureParentName["FlingGestureHandler"] = "FlingGestureHandler";
+    GestureParentName["NativeViewGestureHandler"] = "NativeViewGestureHandler";
+    GestureParentName["LongPressGestureHandler"] = "LongPressGestureHandler";
+    GestureParentName["RotationGestureHandler"] = "RotationGestureHandler";
+    GestureParentName["PinchGestureHandler"] = "PinchGestureHandler";
+    GestureParentName["ForceTouchGestureHandler"] = "ForceTouchGestureHandler";
+    GestureParentName["GestureDetector"] = "GestureDetector";
+})(GestureParentName || (GestureParentName = {}));
+var ChildWrapOnly;
+(function (ChildWrapOnly) {
+    ChildWrapOnly["TouchableOpacity"] = "TouchableOpacity";
+    ChildWrapOnly["TouchableHighlight"] = "TouchableHighlight";
+})(ChildWrapOnly || (ChildWrapOnly = {}));
+const TAP_HANDLER_OVERLAY_TARGETS = [
+    {
+        pkg: 'react-native-gesture-handler',
+        fileSubstring: 'DrawerLayout',
+    },
+    {
+        pkg: '@react-navigation/drawer',
+        fileSubstring: '@react-navigation/drawer',
+    },
+];
+const shouldInstrumentTapHandlerInFile = (state, pkg) => {
+    if (!pkg) {
+        return false;
+    }
+    const rel = path.relative(process.cwd(), state.file).replace(/\\/g, '/');
+    return TAP_HANDLER_OVERLAY_TARGETS.some((t) => t.pkg === pkg && rel.includes(t.fileSubstring));
+};
+const getName = (j, n) => {
+    if (j.JSXIdentifier.check(n)) {
+        return n.name;
+    }
+    if (j.JSXMemberExpression.check(n)) {
+        let c = n;
+        while (j.JSXMemberExpression.check(c)) {
+            c = c.property;
+        }
+        return j.JSXIdentifier.check(c) ? c.name : 'Anonymous';
+    }
+    return 'Anonymous';
+};
+const getBaseAndPropFromMemberExpression = (j, expr) => {
+    let obj = expr.object;
+    while (j.JSXMemberExpression.check(obj)) {
+        obj = obj.object;
+    }
+    const base = j.JSXIdentifier.check(obj) ? obj.name : null;
+    const prop = j.JSXIdentifier.check(expr.property)
+        ? expr.property.name
+        : null;
+    return { base, prop };
+};
+const isStoppedMember = (j, el) => {
+    if (!j.JSXMemberExpression.check(el.name)) {
+        return false;
+    }
+    const { base, prop } = getBaseAndPropFromMemberExpression(j, el.name);
+    return !!(base &&
+        STOP_MEMBER_BASE.includes(base) &&
+        prop &&
+        STOP_MEMBER_PROPS.includes(prop));
+};
+const isTabScreen = (j, el) => {
+    if (!j.JSXMemberExpression.check(el.name)) {
+        return false;
+    }
+    const { base, prop } = getBaseAndPropFromMemberExpression(j, el.name);
+    return !!(base &&
+        TAB_BASE.includes(base) &&
+        prop === Types_1.StopMemberProp.Screen);
+};
+const isStoppedElementName = (name, segmentName, tabButtonName, rootName) => name === Types_1.Literals.ReactFragmentFQN ||
+    STOP_IDS_BASE.includes(name) ||
+    name === segmentName ||
+    name === tabButtonName ||
+    name === rootName;
+const ensureNamedImport = (j, root, from, local) => {
+    const has = root
+        .find(j.ImportDeclaration, { source: { value: from } })
+        .filter((p) => (p.node.specifiers || []).some((s) => {
+        var _a;
+        return j.ImportSpecifier.check(s) &&
+            ((_a = (j.Identifier.check(s.local)
+                ? s.local.name
+                : undefined)) !== null && _a !== void 0 ? _a : (j.Identifier.check(s.imported)
+                ? s.imported.name
+                : undefined)) === local;
+    }))
+        .size() > 0;
+    if (has) {
+        return;
+    }
+    const decl = j.importDeclaration([j.importSpecifier(j.identifier(local))], j.stringLiteral(from));
+    const first = root.find(j.ImportDeclaration).at(0);
+    if (first.size() > 0) {
+        first.insertBefore(decl);
+    }
+    else {
+        root.get().node.program.body.unshift(decl);
+    }
+};
+const hasNamedImportBinding = (j, root, local) => root
+    .find(j.ImportDeclaration)
+    .filter((p) => (p.node.specifiers || []).some((s) => {
+    var _a;
+    return j.ImportSpecifier.check(s) &&
+        ((_a = (j.Identifier.check(s.local) ? s.local.name : undefined)) !== null && _a !== void 0 ? _a : (j.Identifier.check(s.imported)
+            ? s.imported.name
+            : undefined)) === local;
+}))
+    .size() > 0;
+const shouldSkipFile = (file, opts) => {
+    if (!(file !== null && file !== void 0 ? file : '')) {
+        return true;
+    }
+    const rel = path.relative(process.cwd(), file);
+    const relUnix = rel.replace(/\\/g, '/');
+    if (rel.includes(`dt${path.sep}runtime${path.sep}`)) {
+        return true;
+    }
+    const isNodeModulesFile = rel.includes(`node_modules${path.sep}`);
+    const isDrawerModule = rel.includes(`node_modules${path.sep}@react-navigation${path.sep}drawer`);
+    const includePatterns = opts === null || opts === void 0 ? void 0 : opts.include;
+    const excludePatterns = opts === null || opts === void 0 ? void 0 : opts.exclude;
+    if (!isNodeModulesFile && !isDrawerModule) {
+        return ((!!includePatterns && !(0, micromatch_1.isMatch)(relUnix, includePatterns)) ||
+            (!!excludePatterns && (0, micromatch_1.isMatch)(relUnix, excludePatterns)));
+    }
+    return false;
+};
+const valueToExpression = (j, value) => {
+    if (value === null) {
+        return j.nullLiteral();
+    }
+    const t = typeof value;
+    if (t === 'string') {
+        return j.stringLiteral(value);
+    }
+    if (t === 'number') {
+        return j.numericLiteral(value);
+    }
+    if (t === 'boolean') {
+        return j.booleanLiteral(value);
+    }
+    if (Array.isArray(value)) {
+        return j.arrayExpression(value.map((x) => valueToExpression(j, x)));
+    }
+    if (t === 'object') {
+        return j.objectExpression(Object.keys(value).map((k) => j.objectProperty(j.identifier(k), valueToExpression(j, value[k]))));
+    }
+    return j.nullLiteral();
+};
+const injectGlobalPrefixOnce = (j, root, pref) => {
+    if (!pref || !Array.isArray(pref) || pref.length === 0) {
+        return;
+    }
+    const prefixIdent = j.identifier('__AN_PREFIX');
+    const stmt = j.expressionStatement(j.logicalExpression('&&', j.binaryExpression('!==', j.unaryExpression('typeof', j.identifier('globalThis')), j.literal('undefined')), j.logicalExpression('||', j.memberExpression(j.identifier('globalThis'), prefixIdent), j.assignmentExpression('=', j.memberExpression(j.identifier('globalThis'), prefixIdent), valueToExpression(j, pref)))));
+    root.get().node.program.body.unshift(stmt);
+};
+const parentIsNavigator = (j, p) => {
+    const par = p.parentPath;
+    if (!par || !par.value || !j.JSXElement.check(par.value)) {
+        return false;
+    }
+    const op = par.value.openingElement;
+    if (!j.JSXMemberExpression.check(op.name)) {
+        return false;
+    }
+    return (j.JSXIdentifier.check(op.name.property) &&
+        op.name.property.name === Types_1.Literals.NavigatorProp);
+};
+const makeUniqueSuffix = (s) => {
+    const ts = Date.now().toString(36);
+    const rand = Math.random().toString(36).slice(2, 8);
+    const seq = (s.seq++).toString(36);
+    return `${Types_1.Literals.KeySuffixPrefix}${ts}_${seq}_${rand}`;
+};
+const ensureOptionsObjectAttr = (j, openingEl) => {
+    let optionsAttr = (openingEl.attributes || []).find((a) => j.JSXAttribute.check(a) &&
+        j.JSXIdentifier.check(a.name) &&
+        a.name.name === Types_1.AttrName.Options);
+    if (!optionsAttr) {
+        optionsAttr = j.jsxAttribute(j.jsxIdentifier(Types_1.AttrName.Options), j.jsxExpressionContainer(j.objectExpression([])));
+        openingEl.attributes.push(optionsAttr);
+    }
+    return optionsAttr;
+};
+const injectTabBarButtonIntoOptions = (j, optionsAttr, withMask, tabButtonName) => {
+    if (!j.JSXAttribute.check(optionsAttr) ||
+        !j.JSXExpressionContainer.check(optionsAttr.value)) {
+        return false;
+    }
+    const expr = optionsAttr.value.expression;
+    if (!j.ObjectExpression.check(expr)) {
+        return false;
+    }
+    const already = (expr.properties || []).some((p) => j.ObjectProperty.check(p) &&
+        ((j.Identifier.check(p.key) &&
+            p.key.name === Types_1.AttrName.TabBarButton) ||
+            (j.StringLiteral.check(p.key) &&
+                p.key.value === Types_1.AttrName.TabBarButton)));
+    if (already) {
+        return false;
+    }
+    const paramsId = j.identifier('props');
+    const attrs = [j.jsxSpreadAttribute(paramsId)];
+    if (withMask) {
+        attrs.push(j.jsxAttribute(j.jsxIdentifier(Types_1.AttrName.DtUIMask), j.jsxExpressionContainer(j.booleanLiteral(true))));
+    }
+    const opening = j.jsxOpeningElement(j.jsxIdentifier(tabButtonName), attrs, true);
+    const tabBtnEl = j.jsxElement(opening, null, []);
+    const arrow = j.arrowFunctionExpression([paramsId], tabBtnEl);
+    expr.properties.push(j.objectProperty(j.identifier(Types_1.AttrName.TabBarButton), arrow));
+    return true;
+};
+const pickAndRemoveDtUIMask = (j, openingEl) => {
+    const idx = (openingEl.attributes || []).findIndex((a) => j.JSXAttribute.check(a) &&
+        j.JSXIdentifier.check(a.name) &&
+        a.name.name === Types_1.AttrName.DtUIMask);
+    if (idx === -1) {
+        return false;
+    }
+    const attr = openingEl.attributes[idx];
+    let val = true;
+    if (attr.value) {
+        if (j.JSXExpressionContainer.check(attr.value) &&
+            j.BooleanLiteral.check(attr.value.expression)) {
+            val = attr.value.expression.value;
+        }
+        else if (j.JSXExpressionContainer.check(attr.value) &&
+            j.Identifier.check(attr.value.expression)) {
+            val = true;
+        }
+        else if (j.StringLiteral.check(attr.value)) {
+            val = attr.value.value.toLowerCase() !== 'false';
+        }
+    }
+    openingEl.attributes.splice(idx, 1);
+    return !!val;
+};
+const cloneJsxElement = (j, el) => {
+    const open = j.jsxOpeningElement(el.openingElement.name, el.openingElement.attributes ? [...el.openingElement.attributes] : [], el.openingElement.selfClosing);
+    const close = el.closingElement
+        ? j.jsxClosingElement(el.closingElement.name)
+        : null;
+    const children = (el.children || []).map((c) => {
+        if (j.JSXElement.check(c)) {
+            return cloneJsxElement(j, c);
+        }
+        if (j.JSXText.check(c)) {
+            return j.jsxText(c.value);
+        }
+        if (j.JSXExpressionContainer.check(c)) {
+            return j.jsxExpressionContainer(c.expression);
+        }
+        return c;
+    });
+    return j.jsxElement(open, close, children);
+};
+const getNodeModulesPackageName = (filename) => {
+    if (!filename) {
+        return null;
+    }
+    const rel = path.relative(process.cwd(), filename);
+    const parts = rel.split(path.sep);
+    const nmIndex = parts.indexOf('node_modules');
+    if (nmIndex < 0 || nmIndex >= parts.length - 1) {
+        return null;
+    }
+    const first = parts[nmIndex + 1];
+    if (!first) {
+        return null;
+    }
+    if (first.startsWith('@')) {
+        if (nmIndex + 2 >= parts.length) {
+            return null;
+        }
+        const second = parts[nmIndex + 2];
+        return `${first}/${second}`;
+    }
+    return first;
+};
+const collectGestureHandlerInfo = (j, root) => {
+    const gestureHandlerElements = new Set();
+    const directGestureChildren = new Set();
+    root.find(j.JSXElement).forEach((p) => {
+        const node = p.node;
+        const el = node.openingElement;
+        const name = getName(j, el.name);
+        if (Object.values(GestureParentName).includes(name)) {
+            gestureHandlerElements.add(node);
+            const children = node.children || [];
+            for (const ch of children) {
+                if (j.JSXElement.check(ch)) {
+                    directGestureChildren.add(ch);
+                }
+            }
+        }
+    });
+    return { gestureHandlerElements, directGestureChildren };
+};
+const shouldWrapNodeModulesElement = (name, segmentName, tabButtonName, rootName, nodeModulesUITags) => {
+    if (!nodeModulesUITags.has(name)) {
+        return false;
+    }
+    if (isStoppedElementName(name, segmentName, tabButtonName, rootName)) {
+        return false;
+    }
+    if (DANGEROUS_WRAP_DENY.includes(name)) {
+        return false;
+    }
+    return true;
+};
+const handleTabScreen = (ctx, _p, meta) => {
+    const { j, state } = ctx;
+    const { el, tabBtnName } = meta;
+    if (!isTabScreen(j, el)) {
+        return false;
+    }
+    const withMask = !!pickAndRemoveDtUIMask(j, el);
+    const optionsAttr = ensureOptionsObjectAttr(j, el);
+    const changed = injectTabBarButtonIntoOptions(j, optionsAttr, withMask, tabBtnName);
+    if (changed) {
+        state.instrumented = true;
+    }
+    return true;
+};
+const handleNodeModulesUI = (ctx, p, meta) => {
+    const { j, state, isNodeModulesFile, nodeModulesPackageName, skipTags, skipChildrenOf, allowMemberExpr, nodeModulesUITags, gestureHandlerElements, directGestureChildren, } = ctx;
+    const { node, el, name, segName, tabBtnName, rootName } = meta;
+    if (!isNodeModulesFile) {
+        return false;
+    }
+    const isGestureSelf = gestureHandlerElements.has(node);
+    const isDirectGestureChild = directGestureChildren.has(node);
+    const hasJsxChildren = (node.children || []).some((ch) => j.JSXElement.check(ch));
+    if (isGestureSelf) {
+        return true;
+    }
+    if (isDirectGestureChild && hasJsxChildren) {
+        const origChildren = node.children || [];
+        if (!origChildren.length) {
+            return false;
+        }
+        const newChildren = [];
+        for (const ch of origChildren) {
+            if (!j.JSXElement.check(ch)) {
+                newChildren.push(ch);
+                continue;
+            }
+            const childOpening = ch.openingElement;
+            const childName = getName(j, childOpening.name);
+            if (!shouldWrapNodeModulesElement(childName, segName, tabBtnName, rootName, nodeModulesUITags)) {
+                newChildren.push(ch);
+                continue;
+            }
+            const innerClone = cloneJsxElement(j, ch);
+            const segAttrs = [
+                j.jsxAttribute(j.jsxIdentifier(Types_1.AttrName.Name), j.stringLiteral(childName)),
+                j.jsxAttribute(j.jsxIdentifier(Types_1.AttrName.Key), j.stringLiteral(makeUniqueSuffix(state))),
+            ];
+            const segOpen = j.jsxOpeningElement(j.jsxIdentifier(segName), segAttrs, false);
+            const segClose = j.jsxClosingElement(j.jsxIdentifier(segName));
+            const segElement = j.jsxElement(segOpen, segClose, [innerClone]);
+            let wrapped = segElement;
+            if (nodeModulesPackageName) {
+                const pathPrefixOpen = j.jsxOpeningElement(j.jsxIdentifier(PATH_PREFIX_DEFAULT_NAME), [
+                    j.jsxAttribute(j.jsxIdentifier('names'), j.jsxExpressionContainer(j.arrayExpression([
+                        j.objectExpression([
+                            j.objectProperty(j.identifier('name'), j.literal(nodeModulesPackageName)),
+                        ]),
+                    ]))),
+                ], false);
+                const pathPrefixClose = j.jsxClosingElement(j.jsxIdentifier(PATH_PREFIX_DEFAULT_NAME));
+                wrapped = j.jsxElement(pathPrefixOpen, pathPrefixClose, [
+                    segElement,
+                ]);
+            }
+            newChildren.push(wrapped);
+            state.instrumented = true;
+        }
+        node.children = newChildren;
+        return state.instrumented;
+    }
+    if (skipTags.has(name)) {
+        return false;
+    }
+    const parent = p.parentPath;
+    if (parent && parent.value && j.JSXElement.check(parent.value)) {
+        const parentName = getName(j, parent.value.openingElement.name);
+        if (skipChildrenOf.has(parentName)) {
+            return false;
+        }
+    }
+    if (j.JSXMemberExpression.check(el.name)) {
+        const { base, prop } = getBaseAndPropFromMemberExpression(j, el.name);
+        const full = base && prop ? `${base}.${prop}` : null;
+        if (!full || !allowMemberExpr.has(full)) {
+            return false;
+        }
+    }
+    const canWrapThisElement = shouldWrapNodeModulesElement(name, segName, tabBtnName, rootName, nodeModulesUITags);
+    if (!canWrapThisElement) {
+        return false;
+    }
+    const childEl = cloneJsxElement(j, node);
+    const segAttrs = [
+        j.jsxAttribute(j.jsxIdentifier(Types_1.AttrName.Name), j.stringLiteral(name)),
+        j.jsxAttribute(j.jsxIdentifier(Types_1.AttrName.Key), j.stringLiteral(makeUniqueSuffix(state))),
+    ];
+    const segOpen = j.jsxOpeningElement(j.jsxIdentifier(segName), segAttrs, false);
+    const segClose = j.jsxClosingElement(j.jsxIdentifier(segName));
+    const segElement = j.jsxElement(segOpen, segClose, [childEl]);
+    if (!nodeModulesPackageName) {
+        p.replace(segElement);
+        state.instrumented = true;
+        return true;
+    }
+    const pathPrefixOpen = j.jsxOpeningElement(j.jsxIdentifier(PATH_PREFIX_DEFAULT_NAME), [
+        j.jsxAttribute(j.jsxIdentifier('names'), j.jsxExpressionContainer(j.arrayExpression([
+            j.objectExpression([
+                j.objectProperty(j.identifier('name'), j.literal(nodeModulesPackageName)),
+            ]),
+        ]))),
+    ], false);
+    const pathPrefixClose = j.jsxClosingElement(j.jsxIdentifier(PATH_PREFIX_DEFAULT_NAME));
+    const wrapped = j.jsxElement(pathPrefixOpen, pathPrefixClose, [segElement]);
+    p.replace(wrapped);
+    state.instrumented = true;
+    return true;
+};
+const handleNavigatorParent = (ctx, p, _meta) => {
+    const { j } = ctx;
+    return parentIsNavigator(j, p);
+};
+const handleStoppedMemberHandler = (ctx, _p, meta) => {
+    const { j } = ctx;
+    const { el } = meta;
+    return isStoppedMember(j, el);
+};
+const handleStoppedElementHandler = (_ctx, _p, meta) => {
+    const { segName, tabBtnName, rootName, name } = meta;
+    return isStoppedElementName(name, segName, tabBtnName, rootName);
+};
+const handleDangerousWrapHandler = (ctx, _p, meta) => {
+    const { j, state } = ctx;
+    const { el, name } = meta;
+    if (!DANGEROUS_WRAP_DENY.includes(name)) {
+        return false;
+    }
+    const attrs = el.attributes || [];
+    let touched = false;
+    for (let i = 0; i < attrs.length; i++) {
+        const a = attrs[i];
+        if (!j.JSXAttribute.check(a)) {
+            continue;
+        }
+        const propName = j.JSXIdentifier.check(a.name) ? a.name.name : null;
+        if (propName === null || !PRESS_KEYS.includes(propName)) {
+            continue;
+        }
+        if (!a.value) {
+            continue;
+        }
+        if (j.JSXExpressionContainer.check(a.value)) {
+            const expr = a.value.expression;
+            const orig = j.JSXEmptyExpression.check(expr)
+                ? j.identifier('undefined')
+                : expr;
+            const phase = j.literal(propName);
+            const body = j.blockStatement([
+                j.variableDeclaration('const', [
+                    j.variableDeclarator(j.identifier(Types_1.IdName.DtEmit), j.memberExpression(j.identifier('console'), j.identifier('log'))),
+                ]),
+                j.expressionStatement(j.callExpression(j.identifier(Types_1.IdName.DtEmit), [
+                    j.literal(Types_1.Literals.RawHandlerTag),
+                    phase,
+                ])),
+                j.returnStatement(j.conditionalExpression(j.binaryExpression('===', j.unaryExpression('typeof', orig), j.literal('function')), j.callExpression(orig, [
+                    j.spreadElement(j.identifier('args')),
+                ]), j.identifier('undefined'))),
+            ]);
+            a.value = j.jsxExpressionContainer(j.arrowFunctionExpression([j.restElement(j.identifier('args'))], body));
+            touched = true;
+        }
+    }
+    if (touched) {
+        state.instrumented = true;
+    }
+    return true;
+};
+const handleDefaultSegmentWrap = (ctx, p, meta) => {
+    const { j, state, isDrawerModuleFile, isNodeModulesFile, skipTags, skipChildrenOf, gestureHandlerElements, directGestureChildren, } = ctx;
+    const { node, el, name, segName, tabBtnName, rootName } = meta;
+    const isGestureSelf = gestureHandlerElements.has(node);
+    const isDirectGestureChild = directGestureChildren.has(node);
+    if (isGestureSelf || isDirectGestureChild) {
+        return true;
+    }
+    if (isNodeModulesFile) {
+        return false;
+    }
+    if (skipTags.has(name)) {
+        return false;
+    }
+    const parent = p.parentPath;
+    if (parent && parent.value && j.JSXElement.check(parent.value)) {
+        const parentName = getName(j, parent.value.openingElement.name);
+        if (skipChildrenOf.has(parentName)) {
+            return false;
+        }
+    }
+    const segAttrs = [
+        j.jsxAttribute(j.jsxIdentifier(Types_1.AttrName.Name), j.stringLiteral(name)),
+    ];
+    const origAttrs = el.attributes || [];
+    const keyAttr = origAttrs.find((a) => j.JSXAttribute.check(a) &&
+        j.JSXIdentifier.check(a.name) &&
+        a.name.name === Types_1.AttrName.Key);
+    if (keyAttr) {
+        segAttrs.push(keyAttr);
+    }
+    else {
+        segAttrs.push(j.jsxAttribute(j.jsxIdentifier(Types_1.AttrName.Key), j.stringLiteral(makeUniqueSuffix(state))));
+    }
+    const childEl = cloneJsxElement(j, node);
+    if (name === 'TouchableOpacity' || name === 'TouchableHighlight') {
+        const tpChildren = childEl.children || [];
+        const newTpChildren = [];
+        for (const ch of tpChildren) {
+            if (!j.JSXElement.check(ch)) {
+                newTpChildren.push(ch);
+                continue;
+            }
+            const grandOpening = ch.openingElement;
+            const grandName = getName(j, grandOpening.name);
+            if (isStoppedElementName(grandName, segName, tabBtnName, rootName) ||
+                DANGEROUS_WRAP_DENY.includes(grandName)) {
+                newTpChildren.push(ch);
+                continue;
+            }
+            const grandSegAttrs = [
+                j.jsxAttribute(j.jsxIdentifier(Types_1.AttrName.Name), j.stringLiteral(grandName)),
+                j.jsxAttribute(j.jsxIdentifier(Types_1.AttrName.Key), j.stringLiteral(makeUniqueSuffix(state))),
+            ];
+            const grandSegOpen = j.jsxOpeningElement(j.jsxIdentifier(segName), grandSegAttrs, false);
+            const grandSegClose = j.jsxClosingElement(j.jsxIdentifier(segName));
+            const grandInner = cloneJsxElement(j, ch);
+            const wrappedGrand = j.jsxElement(grandSegOpen, grandSegClose, [
+                grandInner,
+            ]);
+            newTpChildren.push(wrappedGrand);
+            state.instrumented = true;
+        }
+        childEl.children = newTpChildren;
+    }
+    if (!isDrawerModuleFile && name === 'View') {
+        const newChildren = [];
+        for (const ch of childEl.children || []) {
+            if (!j.JSXElement.check(ch)) {
+                newChildren.push(ch);
+                continue;
+            }
+            const childOpening = ch.openingElement;
+            const childName = getName(j, childOpening.name);
+            if (childName in ChildWrapOnly) {
+                const tpClone = cloneJsxElement(j, ch);
+                const tpChildren = tpClone.children || [];
+                const newTpChildren = [];
+                for (const grand of tpChildren) {
+                    if (!j.JSXElement.check(grand)) {
+                        newTpChildren.push(grand);
+                        continue;
+                    }
+                    const grandOpening = grand.openingElement;
+                    const grandName = getName(j, grandOpening.name);
+                    if (isStoppedElementName(grandName, segName, tabBtnName, rootName) ||
+                        DANGEROUS_WRAP_DENY.includes(grandName)) {
+                        newTpChildren.push(grand);
+                        continue;
+                    }
+                    const grandSegAttrs = [
+                        j.jsxAttribute(j.jsxIdentifier(Types_1.AttrName.Name), j.stringLiteral(grandName)),
+                        j.jsxAttribute(j.jsxIdentifier(Types_1.AttrName.Key), j.stringLiteral(makeUniqueSuffix(state))),
+                    ];
+                    const grandSegOpen = j.jsxOpeningElement(j.jsxIdentifier(segName), grandSegAttrs, false);
+                    const grandSegClose = j.jsxClosingElement(j.jsxIdentifier(segName));
+                    const grandInner = cloneJsxElement(j, grand);
+                    const wrappedGrand = j.jsxElement(grandSegOpen, grandSegClose, [grandInner]);
+                    newTpChildren.push(wrappedGrand);
+                    state.instrumented = true;
+                }
+                tpClone.children = newTpChildren;
+                newChildren.push(tpClone);
+                continue;
+            }
+            if (isStoppedElementName(childName, segName, tabBtnName, rootName)) {
+                newChildren.push(ch);
+                continue;
+            }
+            if (DANGEROUS_WRAP_DENY.includes(childName)) {
+                newChildren.push(ch);
+                continue;
+            }
+            const childSegAttrs = [
+                j.jsxAttribute(j.jsxIdentifier(Types_1.AttrName.Name), j.stringLiteral(childName)),
+                j.jsxAttribute(j.jsxIdentifier(Types_1.AttrName.Key), j.stringLiteral(makeUniqueSuffix(state))),
+            ];
+            const childSegOpen = j.jsxOpeningElement(j.jsxIdentifier(segName), childSegAttrs, false);
+            const childSegClose = j.jsxClosingElement(j.jsxIdentifier(segName));
+            const innerClone = cloneJsxElement(j, ch);
+            const wrappedChild = j.jsxElement(childSegOpen, childSegClose, [
+                innerClone,
+            ]);
+            newChildren.push(wrappedChild);
+            state.instrumented = true;
+        }
+        childEl.children = newChildren;
+    }
+    const segOpen = j.jsxOpeningElement(j.jsxIdentifier(segName), segAttrs, false);
+    const segClose = j.jsxClosingElement(j.jsxIdentifier(segName));
+    const wrapped = j.jsxElement(segOpen, segClose, [childEl]);
+    p.replace(wrapped);
+    state.instrumented = true;
+    return true;
+};
+const handleTapHandlerOverlay = (ctx, p, meta) => {
+    const { j, state, isNodeModulesFile, nodeModulesPackageName } = ctx;
+    const { node, name, segName, tabBtnName, rootName } = meta;
+    if (!isNodeModulesFile) {
+        return false;
+    }
+    if (name !== 'TapGestureHandler') {
+        return false;
+    }
+    if (!shouldInstrumentTapHandlerInFile(state, nodeModulesPackageName)) {
+        return false;
+    }
+    const children = node.children || [];
+    let targetIndex = -1;
+    for (let i = 0; i < children.length; i++) {
+        const ch = children[i];
+        if (j.JSXElement.check(ch)) {
+            targetIndex = i;
+            break;
+        }
+    }
+    if (targetIndex === -1) {
+        return false;
+    }
+    const childEl = children[targetIndex];
+    if (!j.JSXElement.check(childEl)) {
+        return false;
+    }
+    const childName = getName(j, childEl.openingElement.name);
+    if (isStoppedElementName(childName, segName, tabBtnName, rootName) ||
+        DANGEROUS_WRAP_DENY.includes(childName)) {
+        return false;
+    }
+    const opening = childEl.openingElement;
+    const attrs = opening.attributes || [];
+    let styleAttrIndex = -1;
+    for (let i = 0; i < attrs.length; i++) {
+        const a = attrs[i];
+        if (j.JSXAttribute.check(a) &&
+            j.JSXIdentifier.check(a.name) &&
+            a.name.name === 'style') {
+            styleAttrIndex = i;
+            break;
+        }
+    }
+    const extraStyleObj = j.objectExpression([
+        j.objectProperty(j.identifier('borderWidth'), j.literal(2)),
+        j.objectProperty(j.identifier('borderColor'), j.literal('red')),
+    ]);
+    if (styleAttrIndex === -1) {
+        const styleExpr = j.arrayExpression([extraStyleObj]);
+        attrs.push(j.jsxAttribute(j.jsxIdentifier('style'), j.jsxExpressionContainer(styleExpr)));
+    }
+    else {
+        const styleAttr = attrs[styleAttrIndex];
+        if (j.JSXExpressionContainer.check(styleAttr.value)) {
+            const expr = styleAttr.value.expression;
+            if (j.ArrayExpression.check(expr)) {
+                expr.elements.push(extraStyleObj);
+            }
+            else {
+                styleAttr.value = j.jsxExpressionContainer(j.arrayExpression([expr, extraStyleObj]));
+            }
+        }
+        else {
+            styleAttr.value = j.jsxExpressionContainer(j.arrayExpression([extraStyleObj]));
+        }
+    }
+    opening.attributes = attrs;
+    state.instrumented = true;
+    return true;
+};
+const handleDrawerOverlayPressable = (ctx, p, meta) => {
+    const { j, state, isDrawerModuleFile, isNodeModulesFile } = ctx;
+    const { node, segName } = meta;
+    if (!isNodeModulesFile || !isDrawerModuleFile) {
+        return false;
+    }
+    const children = node.children || [];
+    if (!children.length) {
+        return false;
+    }
+    let modified = false;
+    const newChildren = [];
+    for (let i = 0; i < children.length; i++) {
+        const ch = children[i];
+        if (!j.JSXElement.check(ch)) {
+            newChildren.push(ch);
+            continue;
+        }
+        const childOpening = ch.openingElement;
+        const childName = getName(j, childOpening.name);
+        if (childName !== 'Pressable') {
+            newChildren.push(ch);
+            continue;
+        }
+        const attrs = childOpening.attributes || [];
+        let isOverlayPressable = false;
+        for (let k = 0; k < attrs.length; k++) {
+            const a = attrs[k];
+            if (j.JSXAttribute.check(a) &&
+                j.JSXIdentifier.check(a.name) &&
+                a.name.name === 'style' &&
+                j.JSXExpressionContainer.check(a.value)) {
+                const expr = a.value.expression;
+                if (j.ArrayExpression.check(expr)) {
+                    for (const el of expr.elements || []) {
+                        if (el &&
+                            j.MemberExpression.check(el) &&
+                            j.Identifier.check(el.object) &&
+                            el.object.name === 'styles' &&
+                            j.Identifier.check(el.property) &&
+                            el.property.name === 'pressable') {
+                            isOverlayPressable = true;
+                            break;
+                        }
+                    }
+                }
+                else if (j.MemberExpression.check(expr) &&
+                    j.Identifier.check(expr.object) &&
+                    expr.object.name === 'styles' &&
+                    j.Identifier.check(expr.property) &&
+                    expr.property.name === 'pressable') {
+                    isOverlayPressable = true;
+                }
+            }
+            if (isOverlayPressable) {
+                break;
+            }
+        }
+        if (!isOverlayPressable) {
+            newChildren.push(ch);
+            continue;
+        }
+        const segAttrs = [
+            j.jsxAttribute(j.jsxIdentifier(Types_1.AttrName.Name), j.stringLiteral('DrawerOverlayPressable')),
+            j.jsxAttribute(j.jsxIdentifier(Types_1.AttrName.Key), j.stringLiteral(makeUniqueSuffix(state))),
+        ];
+        const segOpen = j.jsxOpeningElement(j.jsxIdentifier(segName), segAttrs, false);
+        const segClose = j.jsxClosingElement(j.jsxIdentifier(segName));
+        const pressClone = cloneJsxElement(j, ch);
+        const segElement = j.jsxElement(segOpen, segClose, [pressClone]);
+        newChildren.push(segElement);
+        modified = true;
+    }
+    if (!modified) {
+        return false;
+    }
+    node.children = newChildren;
+    state.instrumented = true;
+    return true;
+};
+const applyDTUserInteraction = (root, filename, options = {}) => {
+    var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
+    const j = jsc.withParser('tsx');
+    const { gestureHandlerElements, directGestureChildren } = collectGestureHandlerInfo(j, root);
+    const isDrawerModuleFile = typeof filename === 'string' &&
+        filename.includes(`node_modules${path.sep}@react-navigation${path.sep}drawer`);
+    const isNodeModulesFile = typeof filename === 'string' &&
+        filename.includes(`node_modules${path.sep}`);
+    const nodeModulesPackageName = getNodeModulesPackageName(filename);
+    const state = {
+        file: filename,
+        skip: shouldSkipFile(filename, options),
+        seq: 0,
+        instrumented: false,
+    };
+    if (!state.skip &&
+        Array.isArray(options === null || options === void 0 ? void 0 : options.globalPrefix) &&
+        options.globalPrefix.length > 0) {
+        injectGlobalPrefixOnce(j, root, options.globalPrefix);
+    }
+    const segName = (_b = (_a = options === null || options === void 0 ? void 0 : options.componentNames) === null || _a === void 0 ? void 0 : _a.segment) !== null && _b !== void 0 ? _b : Types_1.Literals.DefaultSegmentName;
+    const tabBtnName = (_d = (_c = options === null || options === void 0 ? void 0 : options.componentNames) === null || _c === void 0 ? void 0 : _c.tabButton) !== null && _d !== void 0 ? _d : Types_1.Literals.DefaultTabButtonName;
+    const rootName = (_f = (_e = options === null || options === void 0 ? void 0 : options.componentNames) === null || _e === void 0 ? void 0 : _e.root) !== null && _f !== void 0 ? _f : Types_1.Literals.DefaultRootName;
+    const uiOptions = ((options === null || options === void 0 ? void 0 : options.ui) || {});
+    const skipTags = new Set(uiOptions.skipTags || []);
+    const skipChildrenOf = new Set(uiOptions.skipChildrenOf || []);
+    const defaultAllowMemberExpr = [
+        'Animated.View',
+        'Animated.Text',
+        'Reanimated.View',
+        'Reanimated.Text',
+    ];
+    const allowMemberExpr = new Set([
+        ...defaultAllowMemberExpr,
+        ...(uiOptions.allowMemberExpressions || []),
+    ]);
+    const nodeModulesUITags = new Set([
+        ...NODE_MODULES_UI_TAGS,
+        ...(uiOptions.extraNodeModulesTags || []),
+    ]);
+    const ctx = {
+        j,
+        state,
+        options,
+        isDrawerModuleFile,
+        isNodeModulesFile,
+        nodeModulesPackageName,
+        skipTags,
+        skipChildrenOf,
+        allowMemberExpr,
+        nodeModulesUITags,
+        gestureHandlerElements,
+        directGestureChildren,
+    };
+    const handlers = [
+        handleTabScreen,
+        handleNavigatorParent,
+        handleStoppedMemberHandler,
+        handleStoppedElementHandler,
+        handleDangerousWrapHandler,
+        handleTapHandlerOverlay,
+        handleDrawerOverlayPressable,
+        handleNodeModulesUI,
+        handleDefaultSegmentWrap,
+    ];
+    root.find(j.JSXElement).forEach((p) => {
+        if (state.skip) {
+            return;
+        }
+        const node = p.node;
+        const el = node.openingElement;
+        const name = getName(j, el.name);
+        const meta = {
+            node,
+            el,
+            name,
+            segName,
+            tabBtnName,
+            rootName,
+        };
+        for (const h of handlers) {
+            if (h(ctx, p, meta)) {
+                break;
+            }
+        }
+    });
+    if (!state.skip && state.instrumented) {
+        const importPath = options.runtimeImport || Types_1.Literals.DefaultRuntimeImport;
+        const segNameImport = (_h = (_g = options === null || options === void 0 ? void 0 : options.componentNames) === null || _g === void 0 ? void 0 : _g.segment) !== null && _h !== void 0 ? _h : Types_1.Literals.DefaultSegmentName;
+        const tabBtnNameImport = (_k = (_j = options === null || options === void 0 ? void 0 : options.componentNames) === null || _j === void 0 ? void 0 : _j.tabButton) !== null && _k !== void 0 ? _k : Types_1.Literals.DefaultTabButtonName;
+        ensureNamedImport(j, root, importPath, segNameImport);
+        ensureNamedImport(j, root, importPath, tabBtnNameImport);
+        ensureNamedImport(j, root, importPath, PATH_PREFIX_DEFAULT_NAME);
+        const shouldInjectPressableImport = options.shouldInjectPressableImport !== false;
+        if (shouldInjectPressableImport &&
+            !hasNamedImportBinding(j, root, 'Pressable')) {
+            ensureNamedImport(j, root, '@dynatrace/react-native-plugin/instrumentation/libs/react-native/', 'Pressable');
+        }
+        const outDir = options.artifactsDir || Types_1.Literals.DefaultArtifactsDir;
+        try {
+            const rel = path.relative(process.cwd(), state.file);
+            const outPath = path.resolve(outDir, rel);
+            if (!isPathInside(outDir, outPath)) {
+                if (options.log) {
+                    console.log(`[UIInteractionPlugin]: Skipping artifact outside output dir. file=${state.file} outDir=${outDir}`);
+                }
+                return { root, changed: !state.skip && state.instrumented };
+            }
+            const code = root.toSource({ quote: 'single' });
+            fs.mkdirSync(path.dirname(outPath), { recursive: true });
+            fs.writeFileSync(outPath, code, 'utf8');
+        }
+        catch (e) {
+            const errorMsg = e instanceof Error ? e.stack || e.message : String(e);
+            if (options.log) {
+                console.log(`[UIInteractionPlugin]: Unable to write artifact for ${state.file}: ${errorMsg}`);
+            }
+        }
+    }
+    return { root, changed: !state.skip && state.instrumented };
+};
+exports.applyDTUserInteraction = applyDTUserInteraction;
+exports.default = exports.applyDTUserInteraction;