diff --git a/src/app/reducers/mainReducer.js b/src/app/reducers/mainReducer.js
index 634bd8009..aeeac8f77 100644
--- a/src/app/reducers/mainReducer.js
+++ b/src/app/reducers/mainReducer.js
@@ -2,7 +2,7 @@
/* eslint-disable prefer-const */
/* eslint-disable @typescript-eslint/explicit-module-boundary-types */
/* eslint-disable no-param-reassign */
-import produce from 'immer';
+import {produce, original} from 'immer';
import * as types from '../constants/actionTypes.ts';
export default (state, action) => produce(state, draft => {
@@ -39,19 +39,37 @@ export default (state, action) => produce(state, draft => {
};
switch (action.type) {
+ case types.ON_HOVER_EXIT: {
+ port.postMessage({
+ action: 'onHoverExit',
+ payload: action.payload,
+ tabId: currentTab,
+ })
+ break;
+ }
+
+ case types.ON_HOVER: {
+ port.postMessage({
+ action: 'onHover',
+ payload: action.payload,
+ tabId: currentTab,
+ })
+ break;
+ }
+
case types.MOVE_BACKWARD: {
if (snapshots.length > 0 && sliderIndex > 0) {
const newIndex = sliderIndex - 1;
// eslint-disable-next-line max-len
// finds the name by the newIndex parsing through the hierarchy to send to background.js the current name in the jump action
const nameFromIndex = findName(newIndex, hierarchy);
-
port.postMessage({
action: 'jumpToSnap',
payload: snapshots[newIndex],
index: newIndex,
name: nameFromIndex,
tabId: currentTab,
+ newProp: 'newPropFromReducer'
});
clearInterval(intervalId);
diff --git a/src/backend/helpers.ts b/src/backend/helpers.ts
index 449472481..0464afe66 100644
--- a/src/backend/helpers.ts
+++ b/src/backend/helpers.ts
@@ -10,6 +10,7 @@
const acorn = require('acorn');
const jsx = require('acorn-jsx');
+
const JSXParser = acorn.Parser.extend(jsx());
/**
diff --git a/src/backend/index.d.ts b/src/backend/index.d.ts
index acb49a75b..b3490c4ce 100644
--- a/src/backend/index.d.ts
+++ b/src/backend/index.d.ts
@@ -38,9 +38,13 @@
*
*/
+
+
declare module "reactime" {
function linkFiber(
container: HTMLElement,
): void;
export = linkFiber;
}
+
+
diff --git a/src/backend/index.ts b/src/backend/index.ts
index f42c1b5b7..a7714e4a8 100644
--- a/src/backend/index.ts
+++ b/src/backend/index.ts
@@ -44,12 +44,12 @@ function getRouteURL(node: SnapshotNode): string {
// * Event listener for time-travel actions
window.addEventListener('message', ({ data: { action, payload } }: MsgData) => {
+ console.log('payload',action)
switch (action) {
case 'jumpToSnap':
timeJump(payload, true); // * This sets state with given payload
// Get the pathname from payload and add new entry to browser history
// MORE: https://developer.mozilla.org/en-US/docs/Web/API/History/pushState
-
// try to modify workInProgress tree from here
// window.history.pushState('', '', getRouteURL(payload));
break;
@@ -59,6 +59,36 @@ window.addEventListener('message', ({ data: { action, payload } }: MsgData) => {
case 'setPause':
mode.paused = payload;
break;
+ case 'onHover':
+ if(Array.isArray(payload)){
+ for (let i=0; i
{
- nodeToNodeSubs.get(node).forEach(
- nodeSubs => allAtomsRelationship.push([node, nodeSubs, 'atoms and selectors'])
- );
- }
- );
-}
+// function getRecoilState(): any {
+// const RecoilSnapshotsLength = window[`$recoilDebugStates`].length;
+// const lastRecoilSnapshot =
+// window[`$recoilDebugStates`][RecoilSnapshotsLength - 1];
+// const nodeToNodeSubs = lastRecoilSnapshot.nodeToNodeSubscriptions;
+// const nodeToNodeSubsKeys = lastRecoilSnapshot.nodeToNodeSubscriptions.keys();
+// nodeToNodeSubsKeys.forEach((node) => {
+// nodeToNodeSubs
+// .get(node)
+// .forEach((nodeSubs) =>
+// allAtomsRelationship.push([node, nodeSubs, 'atoms and selectors'])
+// );
+// });
+// }
/**
* @method sendSnapshot
@@ -63,15 +71,16 @@ function getRecoilState(): any {
function sendSnapshot(snap: Snapshot, mode: Mode): void {
// Don't send messages while jumping or while paused
if (mode.jumping || mode.paused) return;
-
if (!snap.tree) {
snap.tree = new Tree('root', 'root');
}
-
const payload = snap.tree.cleanTreeCopy();
+
if (isRecoil) {
- getRecoilState();
- payload.AtomsRelationship = allAtomsRelationship;
+ // getRecoilState();
+ payload.atomsComponents = atomsComponents;
+ payload.atomSelectors = atomsSelectors;
+ payload.recoilDomNode = recoilDomNode
}
window.postMessage(
@@ -105,13 +114,16 @@ function updateSnapShotTree(snap: Snapshot, mode: Mode): void {
* @param memoizedProps Property containing props on a stateful fctnl component's FiberNode object
* @return An array of array of HookStateItem objects (state and component properties)
*/
-function traverseRecoilHooks(memoizedState: any, memoizedProps: any): HookStates {
+function traverseRecoilHooks(
+ memoizedState: any,
+ memoizedProps: any
+): HookStates {
const hooksStates: HookStates = [];
while (memoizedState && memoizedState.queue) {
if (
- memoizedState.memoizedState
- && memoizedState.queue.lastRenderedReducer
- && memoizedState.queue.lastRenderedReducer.name === 'basicStateReducer'
+ memoizedState.memoizedState &&
+ memoizedState.queue.lastRenderedReducer &&
+ memoizedState.queue.lastRenderedReducer.name === 'basicStateReducer'
) {
if (Object.entries(memoizedProps).length !== 0) {
hooksStates.push({
@@ -120,7 +132,8 @@ function traverseRecoilHooks(memoizedState: any, memoizedProps: any): HookStates
});
}
}
- memoizedState = memoizedState.next !== memoizedState ? memoizedState.next : null;
+ memoizedState =
+ memoizedState.next !== memoizedState ? memoizedState.next : null;
}
return hooksStates;
@@ -131,23 +144,20 @@ function traverseRecoilHooks(memoizedState: any, memoizedProps: any): HookStates
* @param memoizedState memoizedState property on a stateful fctnl component's FiberNode object
* @return An array of array of HookStateItem objects
*
- * Helper function to traverse through memoizedState and inject instrumentation to update our state tree
+ * Helper function to traverse through memoizedState and inject instrumentation to update our state tree
* every time a hooks component changes state
*/
function traverseHooks(memoizedState: any): HookStates {
const hooksStates: HookStates = [];
while (memoizedState && memoizedState.queue) {
- if (
- memoizedState.memoizedState
- && memoizedState.queue.lastRenderedReducer
- && memoizedState.queue.lastRenderedReducer.name === 'basicStateReducer'
- ) {
+ if (memoizedState.memoizedState) {
hooksStates.push({
component: memoizedState.queue,
state: memoizedState.memoizedState,
});
}
- memoizedState = memoizedState.next !== memoizedState ? memoizedState.next : null;
+ memoizedState =
+ memoizedState.next !== memoizedState ? memoizedState.next : null;
}
return hooksStates;
}
@@ -164,17 +174,23 @@ function traverseHooks(memoizedState: any): HookStates {
* 3. Build a new state snapshot
*/
// This runs after every Fiber commit. It creates a new snapshot
+let atomsSelectors = {};
+let atomsComponents = {};
+
function createTree(
currentFiber: Fiber,
tree: Tree = new Tree('root', 'root'),
fromSibling = false
) {
// Base case: child or sibling pointed to null
+
if (!currentFiber) return null;
if (!tree) return tree;
+
// These have the newest state. We update state and then
// called updateSnapshotTree()
+
const {
sibling,
stateNode,
@@ -189,20 +205,50 @@ function createTree(
treeBaseDuration,
} = currentFiber;
- if (elementType?.name && isRecoil) {
- let pointer = memoizedState;
- while (pointer !== null && pointer !== undefined && pointer.next !== null) {
- pointer = pointer.next;
- }
-
- if (pointer?.memoizedState[1]?.[0].current) {
- const atomName = pointer.memoizedState[1]?.[0].current.keys().next().value;
- allAtomsRelationship.push([atomName, elementType?.name, 'atoms and components']);
+
+ //Checks Recoil Atom and Selector Relationships
+ if (
+ currentFiber.memoizedState &&
+ currentFiber.memoizedState.next &&
+ currentFiber.memoizedState.next.memoizedState &&
+ currentFiber.memoizedState.next.memoizedState.deps &&
+ isRecoil &&
+ currentFiber.tag === 0 &&
+ currentFiber.key === null //prevents capturing the same Fiber nodes but different key values that result from being changed
+ ) {
+ let pointer = currentFiber.memoizedState.next;
+ let componentName = currentFiber.elementType.name;
+
+ if (!atomsComponents[componentName]) {
+ atomsComponents[componentName] = [];
+ while (pointer !== null) {
+ if (!Array.isArray(pointer.memoizedState)) {
+ let atomName = pointer.memoizedState.deps[0]['key'];
+ atomsComponents[componentName].push(atomName);
+ }
+ pointer = pointer.next;
+ }
}
- if (pointer?.memoizedState[1]?.[0].key) {
- const atomName = pointer.memoizedState[1]?.[0].key;
- allAtomsRelationship.push([atomName, elementType?.name, 'atoms and components']);
+ if (
+ currentFiber.memoizedState.next.memoizedState.deps[1].current &&
+ !initialstart
+ ) {
+ let getState = currentFiber.memoizedState.next.memoizedState.deps[1].current.getState()
+ .graphsByVersion;
+ getState.entries().forEach((value) => {
+ value[1].nodeDeps.entries().forEach((obj) => {
+ if (!atomsSelectors[obj[0]]) {
+ atomsSelectors[obj[0]] = [];
+ }
+ obj[1].values().forEach((selector) => {
+ if (!atomsSelectors[obj[0]].includes(selector)) {
+ atomsSelectors[obj[0]].push(selector);
+ }
+ });
+ });
+ });
+ initialstart = true;
}
}
@@ -226,30 +272,30 @@ function createTree(
stateNode.state,
stateNode
);
+
newState = stateNode.state;
componentFound = true;
}
let hooksIndex;
-
-
const atomArray = [];
atomArray.push(memoizedProps);
// RECOIL HOOKS
if (
- memoizedState
- && (tag === 0 || tag === 1 || tag === 2 || tag === 10)
- && isRecoil === true
+ memoizedState &&
+ (tag === 0 || tag === 1 || tag === 2 || tag === 10) &&
+ isRecoil === true
) {
+ // console.log('Recoil Hooks Algo', currentFiber)
if (memoizedState.queue) {
// Hooks states are stored as a linked list using memoizedState.next,
// so we must traverse through the list and get the states.
// We then store them along with the corresponding memoizedState.queue,
// which includes the dispatch() function we use to change their state.
const hooksStates = traverseRecoilHooks(memoizedState, memoizedProps);
- hooksStates.forEach(state => {
+ hooksStates.forEach((state) => {
hooksIndex = componentActionsRecord.saveNew(
state.state,
state.component
@@ -272,10 +318,11 @@ function createTree(
// Check if node is a hooks useState function
// REGULAR REACT HOOKS
if (
- memoizedState
- && (tag === 0 || tag === 1 || tag === 2 || tag === 10)
- && isRecoil === false
+ memoizedState &&
+ (tag === 0 || tag === 1 || tag === 2 || tag === 10) &&
+ isRecoil === false
) {
+ // console.log('Regular Hooks Algo', currentFiber)
if (memoizedState.queue) {
// Hooks states are stored as a linked list using memoizedState.next,
// so we must traverse through the list and get the states.
@@ -304,6 +351,7 @@ function createTree(
// This grabs stateless components
if (!componentFound && (tag === 0 || tag === 1 || tag === 2)) {
+ // console.log('Stateless Algo', currentFiber)
newState = 'stateless';
}
@@ -317,19 +365,75 @@ function createTree(
};
let newNode = null;
+
// We want to add this fiber node to the snapshot
if (componentFound || newState === 'stateless') {
if (fromSibling) {
+
+ if(isRecoil){
+ if(currentFiber.elementType.name){
+ if(!recoilDomNode[currentFiber.elementType.name]){
+ recoilDomNode[currentFiber.elementType.name] = [];
+ }
+ }
+
+ let pointer = currentFiber
+
+ while(pointer !== null){
+ if(pointer.stateNode !== null){
+ rtid = "fromLinkFiber" + rtidCounter++
+ recoilDomNode[currentFiber.elementType.name].push(rtid)
+ pointer.stateNode.setAttribute("id", rtid)
+ }
+
+ pointer = pointer.child
+ }
+ } else {
+ if (currentFiber.child && currentFiber.child.stateNode && currentFiber.child.stateNode.setAttribute) {
+ rtid = "fromLinkFiber" + rtidCounter
+ currentFiber.child.stateNode.setAttribute("id", rtid);
+ }
+ rtidCounter++;
+ }
+
newNode = tree.addSibling(
newState,
elementType ? elementType.name : 'nameless',
- componentData
+ componentData,
+ rtid,
+ recoilDomNode
);
} else {
+
+ if(isRecoil){
+ if(currentFiber.elementType.name){
+ if(!recoilDomNode[currentFiber.elementType.name]){
+ recoilDomNode[currentFiber.elementType.name] = [];
+ }
+ }
+ let pointer = currentFiber
+ while(pointer !== null){
+ if(pointer.stateNode !== null){
+ rtid = "fromLinkFiber" + rtidCounter++
+ recoilDomNode[currentFiber.elementType.name].push(rtid)
+ pointer.stateNode.setAttribute("id", rtid)
+ }
+ pointer = pointer.child
+ }
+ } else {
+ if (currentFiber.child && currentFiber.child.stateNode && currentFiber.child.stateNode.setAttribute) {
+ rtid = "fromLinkFiber" + rtidCounter
+ currentFiber.child.stateNode.setAttribute("id", rtid);
+ }
+ rtidCounter++;
+ }
+
newNode = tree.addChild(
newState,
elementType ? elementType.name : 'nameless',
- componentData
+ componentData,
+ rtid,
+ recoilDomNode
);
}
} else {
@@ -343,13 +447,13 @@ function createTree(
// Otherwise, attach children to this same node.
circularComponentTable.add(child);
createTree(child, newNode);
+
}
// Recurse on siblings
if (sibling && !circularComponentTable.has(sibling)) {
circularComponentTable.add(sibling);
createTree(sibling, newNode, true);
}
-
return tree;
}
@@ -369,7 +473,7 @@ export default (snap: Snapshot, mode: Mode): (() => void) => {
const devTools = window.__REACT_DEVTOOLS_GLOBAL_HOOK__;
const reactInstance = devTools ? devTools.renderers.get(1) : null;
fiberRoot = devTools.getFiberRoots(1).values().next().value;
-
+
const throttledUpdateSnapshot = throttle(() => updateSnapShotTree(snap, mode), 70);
document.addEventListener('visibilitychange', onVisibilityChange);
if (reactInstance && reactInstance.version) {
@@ -382,7 +486,7 @@ export default (snap: Snapshot, mode: Mode): (() => void) => {
}
return original(...args);
};
- }(devTools.onCommitFiberRoot));
+ })(devTools.onCommitFiberRoot);
}
throttledUpdateSnapshot();
};
diff --git a/src/backend/timeJump.ts b/src/backend/timeJump.ts
index adf1b1aa0..5ca41fd35 100644
--- a/src/backend/timeJump.ts
+++ b/src/backend/timeJump.ts
@@ -1,3 +1,4 @@
+import { Console } from 'console';
/* eslint-disable @typescript-eslint/no-unused-vars */
/* eslint-disable @typescript-eslint/explicit-module-boundary-types */
/* eslint-disable max-len */
diff --git a/src/backend/tree.ts b/src/backend/tree.ts
index 8df8edf0d..c93888d51 100644
--- a/src/backend/tree.ts
+++ b/src/backend/tree.ts
@@ -45,25 +45,33 @@ class Tree {
parent: Tree
- AtomsRelationship: any;
+ atomsComponents: any;
- constructor(state: string | {}, name = 'nameless', componentData: {} = {}) {
+ atomSelectors: any;
+
+ rtid: any;
+
+ recoilDomNode: any;
+
+ constructor(state: string | {}, name = 'nameless', componentData: {} = {}, rtid: any = null, recoilDomNode:any = null) {
this.state = state === 'root' ? 'root' : serializeState(state);
this.name = name;
this.componentData = componentData ? JSON.parse(JSON.stringify(componentData)) : {};
this.children = [];
this.parent = null; // ref to parent so we can add siblings
+ this.rtid = rtid
+ this.recoilDomNode = recoilDomNode
}
- addChild(state: string | {}, name: string, componentData: {}): Tree {
- const newChild: Tree = new Tree(state, name, componentData);
+ addChild(state: string | {}, name: string, componentData: {}, rtid: any, recoilDomNode:any): Tree {
+ const newChild: Tree = new Tree(state, name, componentData, rtid, recoilDomNode);
newChild.parent = this;
this.children.push(newChild);
return newChild;
}
- addSibling(state: string | {}, name: string, componentData: {}): Tree {
- const newSibling: Tree = new Tree(state, name, componentData);
+ addSibling(state: string | {}, name: string, componentData: {}, rtid: any, recoilDomNode:any): Tree {
+ const newSibling: Tree = new Tree(state, name, componentData, rtid,recoilDomNode);
newSibling.parent = this.parent;
this.parent.children.push(newSibling);
return newSibling;
@@ -82,7 +90,7 @@ class Tree {
circularComponentTable.clear();
}
// creates copy of present node
- let copy: Tree = new Tree(this.state, this.name, this.componentData);
+ let copy: Tree = new Tree(this.state, this.name, this.componentData, this.rtid, this.recoilDomNode);
delete copy.parent;
circularComponentTable.add(this);
copy = scrubUnserializableMembers(copy);
diff --git a/src/extension/background.js b/src/extension/background.js
index 106192b16..d6bdfb757 100644
--- a/src/extension/background.js
+++ b/src/extension/background.js
@@ -4,6 +4,8 @@
/* eslint-disable function-paren-newline */
/* eslint-disable implicit-arrow-linebreak */
+import snapshots from "../app/components/snapshots";
+
// store ports in an array
const portsArr = [];
const reloaded = {};
@@ -91,14 +93,14 @@ function changeCurrLocation(tabObj, rootNode, index, name) {
}
if (rootNode.children) {
- rootNode.children.forEach(child => {
+ rootNode.children.forEach((child) => {
changeCurrLocation(tabObj, child, index, name);
});
}
}
// establishing connection with devtools
-chrome.runtime.onConnect.addListener(port => {
+chrome.runtime.onConnect.addListener((port) => {
// port is one end of the connection - an object
// push every port connected to the ports array
@@ -113,7 +115,7 @@ chrome.runtime.onConnect.addListener(port => {
}
// every time devtool is closed, remove the port from portsArr
- port.onDisconnect.addListener(e => {
+ port.onDisconnect.addListener((e) => {
for (let i = 0; i < portsArr.length; i += 1) {
if (portsArr[i] === e) {
portsArr.splice(i, 1);
@@ -123,7 +125,7 @@ chrome.runtime.onConnect.addListener(port => {
});
// receive snapshot from devtools and send it to contentScript -
- port.onMessage.addListener(msg => {
+ port.onMessage.addListener((msg) => {
// msg is action denoting a time jump in devtools
// ---------------------------------------------------------------
@@ -146,13 +148,20 @@ chrome.runtime.onConnect.addListener(port => {
// records snapshot of page initial state
tabsObj[tabId].initialSnapshot.push(tabsObj[tabId].snapshots[0]);
// reset snapshots to page last state recorded
- tabsObj[tabId].snapshots = [tabsObj[tabId].snapshots[tabsObj[tabId].snapshots.length - 1]];
+ tabsObj[tabId].snapshots = [
+ tabsObj[tabId].snapshots[tabsObj[tabId].snapshots.length - 1],
+ ];
// records hierarchy of page initial state
- tabsObj[tabId].initialHierarchy = { ...tabsObj[tabId].hierarchy, children: [] };
+ tabsObj[tabId].initialHierarchy = {
+ ...tabsObj[tabId].hierarchy,
+ children: [],
+ };
// resets hierarchy
tabsObj[tabId].hierarchy.children = [];
// resets hierarchy to page last state recorded
- tabsObj[tabId].hierarchy.stateSnapshot = { ...tabsObj[tabId].snapshots[0] };
+ tabsObj[tabId].hierarchy.stateSnapshot = {
+ ...tabsObj[tabId].snapshots[0],
+ };
// resets currLocation to page last state recorded
tabsObj[tabId].currLocation = tabsObj[tabId].hierarchy;
// resets index
@@ -192,10 +201,10 @@ chrome.runtime.onMessage.addListener((request, sender) => {
// Filter out tabs that don't have reactime
if (
- action === 'tabReload'
- || action === 'recordSnap'
- || action === 'jumpToSnap'
- || action === 'injectScript'
+ action === 'tabReload' ||
+ action === 'recordSnap' ||
+ action === 'jumpToSnap' ||
+ action === 'injectScript'
) {
isReactTimeTravel = true;
} else {
@@ -263,11 +272,11 @@ chrome.runtime.onMessage.addListener((request, sender) => {
tabsObj[tabId].currBranch = 0;
// send a message to devtools
- portsArr.forEach(bg =>
+ portsArr.forEach((bg) =>
bg.postMessage({
action: 'initialConnectSnapshots',
payload: tabsObj,
- }),
+ })
);
}
reloaded[tabId] = true;
@@ -275,9 +284,12 @@ chrome.runtime.onMessage.addListener((request, sender) => {
break;
}
case 'recordSnap': {
+
const sourceTab = tabId;
// first snapshot received from tab
if (!firstSnapshotReceived[tabId]) {
+
+
firstSnapshotReceived[tabId] = true;
reloaded[tabId] = false;
@@ -285,19 +297,24 @@ chrome.runtime.onMessage.addListener((request, sender) => {
sendToHierarchy(
tabsObj[tabId],
- new Node(request.payload, tabsObj[tabId]),
+ new Node(request.payload, tabsObj[tabId])
);
if (portsArr.length > 0) {
- portsArr.forEach(bg =>
+ portsArr.forEach((bg) =>
bg.postMessage({
action: 'initialConnectSnapshots',
payload: tabsObj,
- }),
+ })
);
}
break;
}
+ // DUPLICATE SNAPSHOT CHECK
+ const previousSnap = tabsObj[tabId].currLocation.stateSnapshot.children[0].componentData.actualDuration;
+ const incomingSnap = request.payload.children[0].componentData.actualDuration;
+ if (previousSnap === incomingSnap) break;
+
// don't add anything to snapshot storage if tab is reloaded for the initial snapshot
if (reloaded[tabId]) {
reloaded[tabId] = false;
@@ -306,17 +323,17 @@ chrome.runtime.onMessage.addListener((request, sender) => {
//! INVOKING buildHierarchy FIGURE OUT WHAT TO PASS IN!!!!
sendToHierarchy(
tabsObj[tabId],
- new Node(request.payload, tabsObj[tabId]),
+ new Node(request.payload, tabsObj[tabId])
);
}
// send message to devtools
if (portsArr.length > 0) {
- portsArr.forEach(bg =>
+ portsArr.forEach((bg) =>
bg.postMessage({
action: 'sendSnapshots',
payload: tabsObj,
sourceTab,
- }),
+ })
);
}
break;
@@ -324,18 +341,19 @@ chrome.runtime.onMessage.addListener((request, sender) => {
default:
break;
}
+ // console.log('inside background.js, tabsObj:', tabsObj);
return true; // attempt to fix close port error
});
// when tab is closed, remove the tabid from the tabsObj
-chrome.tabs.onRemoved.addListener(tabId => {
+chrome.tabs.onRemoved.addListener((tabId) => {
// tell devtools which tab to delete
if (portsArr.length > 0) {
- portsArr.forEach(bg =>
+ portsArr.forEach((bg) =>
bg.postMessage({
action: 'deleteTab',
payload: tabId,
- }),
+ })
);
}
@@ -352,11 +370,11 @@ chrome.tabs.onUpdated.addListener((tabId, changeInfo) => {
if (changeInfo.title && changeInfo.title !== tabsObj[tabId].title) {
// tell devtools which tab to delete
if (portsArr.length > 0) {
- portsArr.forEach(bg =>
+ portsArr.forEach((bg) =>
bg.postMessage({
action: 'deleteTab',
payload: tabId,
- }),
+ })
);
}
@@ -372,14 +390,14 @@ chrome.tabs.onUpdated.addListener((tabId, changeInfo) => {
});
// when tab is view change, put the tabid as the current tab
-chrome.tabs.onActivated.addListener(info => {
+chrome.tabs.onActivated.addListener((info) => {
// tell devtools which tab to be the current
if (portsArr.length > 0) {
- portsArr.forEach(bg =>
+ portsArr.forEach((bg) =>
bg.postMessage({
action: 'changeTab',
payload: info,
- }),
+ })
);
}
});
diff --git a/src/extension/build/assets/logo-no-version.png b/src/extension/build/assets/logo-no-version.png
new file mode 100644
index 000000000..1cbbd91bf
Binary files /dev/null and b/src/extension/build/assets/logo-no-version.png differ
diff --git a/src/extension/build/manifest.json b/src/extension/build/manifest.json
index 1c8faff50..b5189972b 100644
--- a/src/extension/build/manifest.json
+++ b/src/extension/build/manifest.json
@@ -1,6 +1,6 @@
{
"name": "Reactime",
- "version": "5.0.0",
+ "version": "6.0.0",
"devtools_page": "devtools.html",
"description": "A Chrome extension that helps debug React applications by memorizing the state of components with every render.",
"manifest_version": 2,
diff --git a/src/extension/contentScript.ts b/src/extension/contentScript.ts
index f95501487..e1e6f0c7e 100644
--- a/src/extension/contentScript.ts
+++ b/src/extension/contentScript.ts
@@ -15,7 +15,6 @@ window.addEventListener('message', msg => { // runs automatically every second
// post initial Message to background.js
const { action }: { action: string } = msg.data;
-
if (action === 'recordSnap') { // this is firing on page load
chrome.runtime.sendMessage(msg.data);
}
@@ -34,7 +33,11 @@ chrome.runtime.onMessage.addListener(request => { // seems to never fire
case 'setPause':
window.postMessage(request, '*');
break;
+ case 'onHover':
+ window.postMessage(request, '*');
default:
+ case 'onHoverExit':
+ window.postMessage(request, '*');
break;
}
return true; // attempt to fix port closing console error
diff --git a/tests/manual-tests/ConcurrentMode/package-lock.json b/tests/manual-tests/ConcurrentMode/package-lock.json
index c6192504e..82eca1bd0 100644
--- a/tests/manual-tests/ConcurrentMode/package-lock.json
+++ b/tests/manual-tests/ConcurrentMode/package-lock.json
@@ -1,6 +1,6 @@
{
"name": "reactime-sandboxes",
- "version": "0.1.0",
+ "version": "4.0.0",
"lockfileVersion": 1,
"requires": true,
"dependencies": {
@@ -4235,9 +4235,9 @@
"dev": true
},
"http-proxy": {
- "version": "1.18.1",
- "resolved": "https://registry.npmjs.org/http-proxy/-/http-proxy-1.18.1.tgz",
- "integrity": "sha512-7mz/721AbnJwIVbnaSv1Cz3Am0ZLT/UBwkC92VlxhXv/k/BBQfM2fXElQNC27BVGr0uwUpplYPQM9LnaBMR5NQ==",
+ "version": "1.18.0",
+ "resolved": "https://registry.npmjs.org/http-proxy/-/http-proxy-1.18.0.tgz",
+ "integrity": "sha512-84I2iJM/n1d4Hdgc6y2+qY5mDaz2PUVjlg9znE9byl+q0uC3DeByqBGReQu5tpLK0TAqTIXScRUV+dg7+bUPpQ==",
"dev": true,
"requires": {
"eventemitter3": "^4.0.0",
diff --git a/tsconfig.json b/tsconfig.json
index 27c502586..6a8f5fa3e 100644
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -6,6 +6,7 @@
"jsx": "react",
"removeComments": true,
"allowJs": true,
+ "allowSyntheticDefaultImports": true,
"typeRoots": [
"./node_modules/@types"
],
@@ -13,7 +14,7 @@
"esModuleInterop": true,
"moduleResolution": "node",
"resolveJsonModule": true,
- "forceConsistentCasingInFileNames": true
+ "forceConsistentCasingInFileNames": true,
},
"include": ["./src/app", "./src/backend", "./src/extension"],
"exclude": ["./src/app/__tests__", "./src/backend/__tests__"],
+ 
-
+
+