Spaces:
Running
Running
File size: 3,881 Bytes
e8a57cb | 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145 146 147 | import { options, Fragment } from 'preact';
/**
* Get human readable name of the component/dom node
* @param {import('./internal').VNode} vnode
* @param {import('./internal').VNode} vnode
* @returns {string}
*/
export function getDisplayName(vnode) {
if (vnode.type === Fragment) {
return 'Fragment';
} else if (typeof vnode.type == 'function') {
return vnode.type.displayName || vnode.type.name;
} else if (typeof vnode.type == 'string') {
return vnode.type;
}
return '#text';
}
/**
* Used to keep track of the currently rendered `vnode` and print it
* in debug messages.
*/
let renderStack = [];
/**
* Keep track of the current owners. An owner describes a component
* which was responsible to render a specific `vnode`. This exclude
* children that are passed via `props.children`, because they belong
* to the parent owner.
*
* ```jsx
* const Foo = props => <div>{props.children}</div> // div's owner is Foo
* const Bar = props => {
* return (
* <Foo><span /></Foo> // Foo's owner is Bar, span's owner is Bar
* )
* }
* ```
*
* Note: A `vnode` may be hoisted to the root scope due to compiler
* optimiztions. In these cases the `_owner` will be different.
*/
let ownerStack = [];
/**
* Get the currently rendered `vnode`
* @returns {import('./internal').VNode | null}
*/
export function getCurrentVNode() {
return renderStack.length > 0 ? renderStack[renderStack.length - 1] : null;
}
/**
* If the user doesn't have `@babel/plugin-transform-react-jsx-source`
* somewhere in his tool chain we can't print the filename and source
* location of a component. In that case we just omit that, but we'll
* print a helpful message to the console, notifying the user of it.
*/
let showJsxSourcePluginWarning = true;
/**
* Check if a `vnode` is a possible owner.
* @param {import('./internal').VNode} vnode
*/
function isPossibleOwner(vnode) {
return typeof vnode.type == 'function' && vnode.type != Fragment;
}
/**
* Return the component stack that was captured up to this point.
* @param {import('./internal').VNode} vnode
* @returns {string}
*/
export function getOwnerStack(vnode) {
const stack = [vnode];
let next = vnode;
while (next._owner != null) {
stack.push(next._owner);
next = next._owner;
}
return stack.reduce((acc, owner) => {
acc += ` in ${getDisplayName(owner)}`;
const source = owner.__source;
if (source) {
acc += ` (at ${source.fileName}:${source.lineNumber})`;
} else if (showJsxSourcePluginWarning) {
console.warn(
'Add @babel/plugin-transform-react-jsx-source to get a more detailed component stack. Note that you should not add it to production builds of your App for bundle size reasons.'
);
}
showJsxSourcePluginWarning = false;
return (acc += '\n');
}, '');
}
/**
* Setup code to capture the component trace while rendering. Note that
* we cannot simply traverse `vnode._parent` upwards, because we have some
* debug messages for `this.setState` where the `vnode` is `undefined`.
*/
export function setupComponentStack() {
let oldDiff = options._diff;
let oldDiffed = options.diffed;
let oldRoot = options._root;
let oldVNode = options.vnode;
let oldRender = options._render;
options.diffed = vnode => {
if (isPossibleOwner(vnode)) {
ownerStack.pop();
}
renderStack.pop();
if (oldDiffed) oldDiffed(vnode);
};
options._diff = vnode => {
if (isPossibleOwner(vnode)) {
renderStack.push(vnode);
}
if (oldDiff) oldDiff(vnode);
};
options._root = (vnode, parent) => {
ownerStack = [];
if (oldRoot) oldRoot(vnode, parent);
};
options.vnode = vnode => {
vnode._owner =
ownerStack.length > 0 ? ownerStack[ownerStack.length - 1] : null;
if (oldVNode) oldVNode(vnode);
};
options._render = vnode => {
if (isPossibleOwner(vnode)) {
ownerStack.push(vnode);
}
if (oldRender) oldRender(vnode);
};
}
|