firefox-devtools · gregtatum · Jan 5, 2018 · Jan 3, 2018
diff --git a/res/drop-icon.svg b/res/drop-icon.svg
diff --git a/src/components/calltree/ProfileCallTreeContextMenu.css b/src/components/calltree/ProfileCallTreeContextMenu.css
@@ -23,6 +23,10 @@
   background: url(../../../res/focus-icon.svg) center center no-repeat;
 }
 
+.profileCallTreeContextMenuIconDrop {
+  background: url(../../../res/drop-icon.svg) center center no-repeat;
+}
+
 .profileCallTreeContextMenuLabel {
   color: #555;
   font-weight: bold;

diff --git a/src/components/calltree/ProfileCallTreeContextMenu.js b/src/components/calltree/ProfileCallTreeContextMenu.js
@@ -108,11 +108,11 @@ class ProfileCallTreeContextMenu extends PureComponent<Props> {
         break;
       case 'merge-call-node':
       case 'merge-function':
-      case 'merge-subtree':
       case 'focus-subtree':
       case 'focus-function':
       case 'collapse-resource':
       case 'collapse-direct-recursion':
+      case 'drop-function':
         this.addTransformToStack(type);
         break;
       default:
@@ -146,14 +146,6 @@ class ProfileCallTreeContextMenu extends PureComponent<Props> {
           funcIndex: selectedFunc,
         });
         break;
-      case 'merge-subtree':
-        addTransformToStack(threadIndex, {
-          type: 'merge-subtree',
-          callNodePath: selectedCallNodePath,
-          implementation,
-          inverted,
-        });
-        break;
       case 'merge-call-node':
         addTransformToStack(threadIndex, {
           type: 'merge-call-node',
@@ -167,6 +159,12 @@ class ProfileCallTreeContextMenu extends PureComponent<Props> {
           funcIndex: selectedFunc,
         });
         break;
+      case 'drop-function':
+        addTransformToStack(threadIndex, {
+          type: 'drop-function',
+          funcIndex: selectedFunc,
+        });
+        break;
       case 'collapse-resource': {
         const { funcTable } = thread;
         const resourceIndex = funcTable.resource[selectedFunc];
@@ -268,9 +266,6 @@ class ProfileCallTreeContextMenu extends PureComponent<Props> {
           <span className="profileCallTreeContextMenuIcon profileCallTreeContextMenuIconMerge" />
           Merge function into caller across the entire tree
         </MenuItem>
-        {/* <MenuItem onClick={this.handleClick} data={{ type: 'mergeSubtree' }}>
-          Merge subtree into calling function
-        </MenuItem> */}
         <MenuItem onClick={this.handleClick} data={{ type: 'focus-subtree' }}>
           <span className="profileCallTreeContextMenuIcon profileCallTreeContextMenuIconFocus" />
           Focus on subtree
@@ -302,6 +297,10 @@ class ProfileCallTreeContextMenu extends PureComponent<Props> {
               Collapse direct recursion
             </MenuItem>
           : null}
+        <MenuItem onClick={this.handleClick} data={{ type: 'drop-function' }}>
+          <span className="profileCallTreeContextMenuIcon profileCallTreeContextMenuIconDrop" />
+          Drop samples with this function
+        </MenuItem>
         <div className="react-contextmenu-separator" />
         <MenuItem
           onClick={this.handleClick}

diff --git a/src/profile-logic/transforms.js b/src/profile-logic/transforms.js
@@ -34,19 +34,19 @@ import type { Transform, TransformStack } from '../types/transforms';
 const TRANSFORM_TO_SHORT_KEY = {
   'focus-subtree': 'f',
   'focus-function': 'ff',
-  'merge-subtree': 'ms',
   'merge-call-node': 'mcn',
   'merge-function': 'mf',
+  'drop-function': 'df',
   'collapse-resource': 'cr',
   'collapse-direct-recursion': 'rec',
 };
 
 const SHORT_KEY_TO_TRANSFORM = {
   f: 'focus-subtree',
   ff: 'focus-function',
-  ms: 'merge-subtree',
   mcn: 'merge-call-node',
   mf: 'merge-function',
+  df: 'drop-function',
   cr: 'collapse-resource',
   rec: 'collapse-direct-recursion',
 };
@@ -108,6 +108,7 @@ export function parseTransforms(stringValue: string = ''): TransformStack {
         break;
       }
       case 'merge-function':
+      case 'drop-function':
       case 'focus-function': {
         // e.g. "mf-325"
         const [, funcIndexRaw] = tuple;
@@ -127,15 +128,20 @@ export function parseTransforms(stringValue: string = ''): TransformStack {
                 funcIndex,
               });
               break;
+            case 'drop-function':
+              transforms.push({
+                type: 'drop-function',
+                funcIndex,
+              });
+              break;
             default:
               throw new Error('Unmatched transform.');
           }
         }
         break;
       }
       case 'focus-subtree':
-      case 'merge-call-node':
-      case 'merge-subtree': {
+      case 'merge-call-node': {
         // e.g. "f-js-xFFpUMl-i" or "f-cpp-0KV4KV5KV61KV7KV8K"
         const [
           ,
@@ -163,14 +169,6 @@ export function parseTransforms(stringValue: string = ''): TransformStack {
               callNodePath,
             });
             break;
-          case 'merge-subtree':
-            transforms.push({
-              type: 'merge-subtree',
-              implementation,
-              callNodePath,
-              inverted,
-            });
-            break;
           default:
             throw new Error('Unmatched transform.');
         }
@@ -193,6 +191,7 @@ export function stringifyTransforms(transforms: TransformStack = []): string {
       const shortKey = TRANSFORM_TO_SHORT_KEY[transform.type];
       switch (transform.type) {
         case 'merge-function':
+        case 'drop-function':
           return `${shortKey}-${transform.funcIndex}`;
         case 'focus-function': {
           let string = `${shortKey}-${transform.funcIndex}`;
@@ -206,8 +205,7 @@ export function stringifyTransforms(transforms: TransformStack = []): string {
         case 'collapse-direct-recursion':
           return `${shortKey}-${transform.implementation}-${transform.funcIndex}`;
         case 'focus-subtree':
-        case 'merge-call-node':
-        case 'merge-subtree': {
+        case 'merge-call-node': {
           let string = [
             shortKey,
             transform.implementation,
@@ -252,12 +250,12 @@ export function getTransformLabels(
     let funcIndex;
     switch (transform.type) {
       case 'focus-subtree':
-      case 'merge-subtree':
       case 'merge-call-node':
         funcIndex = transform.callNodePath[transform.callNodePath.length - 1];
         break;
       case 'focus-function':
       case 'merge-function':
+      case 'drop-function':
       case 'collapse-direct-recursion':
         funcIndex = transform.funcIndex;
         break;
@@ -272,12 +270,12 @@ export function getTransformLabels(
         return `Focus Node: ${funcName}`;
       case 'focus-function':
         return `Focus: ${funcName}`;
-      case 'merge-subtree':
-        return `Merge Subtree: ${funcName}`;
       case 'merge-call-node':
         return `Merge Node: ${funcName}`;
       case 'merge-function':
         return `Merge: ${funcName}`;
+      case 'drop-function':
+        return `Drop: ${funcName}`;
       case 'collapse-direct-recursion':
         return `Collapse recursion: ${funcName}`;
       default:
@@ -305,6 +303,8 @@ export function applyTransformToCallNodePath(
       return _mergeNodeInCallNodePath(transform.callNodePath, callNodePath);
     case 'merge-function':
       return _mergeFunctionInCallNodePath(transform.funcIndex, callNodePath);
+    case 'drop-function':
+      return _dropFunctionInCallNodePath(transform.funcIndex, callNodePath);
     case 'collapse-resource':
       return _collapseResourceInCallNodePath(
         transform.resourceIndex,
@@ -357,6 +357,14 @@ function _mergeFunctionInCallNodePath(
   return callNodePath.filter(nodeFunc => nodeFunc !== funcIndex);
 }
 
+function _dropFunctionInCallNodePath(
+  funcIndex: IndexIntoFuncTable,
+  callNodePath: CallNodePath
+): CallNodePath {
+  // If the CallNodePath contains the function, return an empty path.
+  return callNodePath.includes(funcIndex) ? [] : callNodePath;
+}
+
 function _collapseResourceInCallNodePath(
   resourceIndex: IndexIntoResourceTable,
   collapsedFuncIndex: IndexIntoFuncTable,
@@ -572,6 +580,42 @@ export function mergeFunction(
   });
 }
 
+/**
+ * Drop any samples that contain the given function.
+ */
+export function dropFunction(
+  thread: Thread,
+  funcIndexToDrop: IndexIntoFuncTable
+) {
+  const { stackTable, frameTable, samples } = thread;
+
+  // Go through each stack, and label it as containing the function or not.
+  const stackContainsFunc: Array<void | true> = [];
+  for (let stackIndex = 0; stackIndex < stackTable.length; stackIndex++) {
+    const prefix = stackTable.prefix[stackIndex];
+    const frameIndex = stackTable.frame[stackIndex];
+    const funcIndex = frameTable.func[frameIndex];
+    if (
+      // This is the function we want to remove.
+      funcIndex === funcIndexToDrop ||
+      // The parent of this stack contained the function.
+      (prefix !== null && stackContainsFunc[prefix])
+    ) {
+      stackContainsFunc[stackIndex] = true;
+    }
+  }
+
+  // Regenerate the stacks for the samples table.
+  const stack = samples.stack.map(
+    stack => (stack !== null && stackContainsFunc[stack] ? null : stack)
+  );
+
+  // Return the thread with the replaced samples.
+  return Object.assign({}, thread, {
+    samples: Object.assign({}, samples, { stack }),
+  });
+}
+
 export function collapseResource(
   thread: Thread,
   resourceIndexToCollapse: IndexIntoResourceTable,

diff --git a/src/reducers/profile-view.js b/src/reducers/profile-view.js
@@ -513,9 +513,6 @@ export const selectorsForThread = (
                 transform.callNodePath,
                 transform.implementation
               );
-        case 'merge-subtree':
-          // TODO - Implement this transform.
-          return thread;
         case 'merge-call-node':
           return Transforms.mergeCallNode(
             thread,
@@ -524,6 +521,8 @@ export const selectorsForThread = (
           );
         case 'merge-function':
           return Transforms.mergeFunction(thread, transform.funcIndex);
+        case 'drop-function':
+          return Transforms.dropFunction(thread, transform.funcIndex);
         case 'focus-function':
           return Transforms.focusFunction(thread, transform.funcIndex);
         case 'collapse-resource':

diff --git a/src/test/store/transforms.test.js b/src/test/store/transforms.test.js
@@ -352,6 +352,52 @@ describe('"merge-function" transform', function() {
   });
 });
 
+describe('"drop-function" transform', function() {
+  describe('on a call tree', function() {
+    const { profile, funcNames } = getProfileFromTextSamples(`
+      A A A A
+      B B C B
+      C C   E
+        D
+    `);
+    const threadIndex = 0;
+    const C = funcNames.indexOf('C');
+
+    const { dispatch, getState } = storeWithProfile(profile);
+    const originalCallTree = selectedThreadSelectors.getCallTree(getState());
+
+    function formatTreeIntoArray(tree) {
+      return formatTree(tree).split('\n').filter(string => string);
+    }
+
+    it('starts as an unfiltered call tree', function() {
+      expect(formatTreeIntoArray(originalCallTree)).toEqual([
+        '- A (total: 4, self:—)',
+        ' - B (total: 3, self:—)',
+        '   - C (total: 2, self:1)',
+        '     - D (total: 1, self:1)',
+        '   - E (total: 1, self:1)',
+        ' - C (total: 1, self:1)',
+      ]);
+    });
+
+    it('function C can be merged into callers', function() {
+      dispatch(
+        addTransformToStack(threadIndex, {
+          type: 'drop-function',
+          funcIndex: C,
+        })
+      );
+      const callTree = selectedThreadSelectors.getCallTree(getState());
+      expect(formatTreeIntoArray(callTree)).toEqual([
+        '- A (total: 1, self:—)',
+        ' - B (total: 1, self:—)',
+        '   - E (total: 1, self:1)',
+      ]);
+    });
+  });
+});
+
 describe('"focus-function" transform', function() {
   describe('on a call tree', function() {
     /**

diff --git a/src/test/url-handling.test.js b/src/test/url-handling.test.js
@@ -236,7 +236,7 @@ describe('url upgrading', function() {
 
 describe('URL serialization of the transform stack', function() {
   const transformString =
-    'f-combined-012~ms-js-123~mcn-combined-234~f-js-345-i~mf-6~ff-7~cr-combined-8-9~rec-combined-10';
+    'f-combined-012~mcn-combined-234~f-js-345-i~mf-6~ff-7~cr-combined-8-9~rec-combined-10~df-11';
   const { getState } = _getStoreWithURL({
     search: '?transforms=' + transformString,
   });
@@ -254,12 +254,6 @@ describe('URL serialization of the transform stack', function() {
         implementation: 'combined',
         inverted: false,
       },
-      {
-        type: 'merge-subtree',
-        callNodePath: [1, 2, 3],
-        implementation: 'js',
-        inverted: false,
-      },
       {
         type: 'merge-call-node',
         callNodePath: [2, 3, 4],
@@ -290,6 +284,10 @@ describe('URL serialization of the transform stack', function() {
         funcIndex: 10,
         implementation: 'combined',
       },
+      {
+        type: 'drop-function',
+        funcIndex: 11,
+      },
     ]);
   });