@shopify/ui-extensions-server-kit 0.0.0-snapshot-20240814205424

package/node_modules/@shopify/react-testing/build/esm/root.mjs

@@ -0,0 +1,275 @@
+import React from 'react';
+import { render, unmountComponentAtNode } from 'react-dom';
+import { act } from 'react-dom/test-utils';
+import { TestWrapper } from './TestWrapper.mjs';
+import { Element } from './element.mjs';
+import { getInternals } from './compat.mjs';
+import { Tag } from './types.mjs';
+
+const {
+  findCurrentFiberUsingSlowPath
+} = require('react-reconciler/reflection');
+
+const connected = new Set();
+class Root {
+  get props() {
+    return this.withRoot(root => root.props);
+  }
+
+  get isDOM() {
+    return this.withRoot(root => root.isDOM);
+  }
+
+  get type() {
+    return this.withRoot(root => root.type);
+  }
+
+  get instance() {
+    return this.withRoot(root => root.instance);
+  }
+
+  get children() {
+    return this.withRoot(root => root.children);
+  }
+
+  get descendants() {
+    return this.withRoot(root => root.descendants);
+  }
+
+  get domNodes() {
+    return this.withRoot(root => root.domNodes);
+  }
+
+  get domNode() {
+    return this.withRoot(root => root.domNode);
+  }
+
+  get mounted() {
+    return this.wrapper != null;
+  }
+
+  constructor(tree, {
+    render = defaultRender,
+    resolveRoot = defaultResolveRoot
+  } = {}) {
+    this.tree = tree;
+    this.wrapper = null;
+    this.element = document.createElement('div');
+    this.root = null;
+    this.acting = false;
+    this.render = void 0;
+    this.resolveRoot = void 0;
+    this.render = render;
+    this.resolveRoot = resolveRoot;
+    this.mount();
+  }
+
+  act(action, {
+    update = true
+  } = {}) {
+    const updateWrapper = update ? this.update.bind(this) : noop;
+    let result;
+
+    if (this.acting) {
+      return action();
+    }
+
+    this.acting = true;
+
+    const afterResolve = () => {
+      updateWrapper();
+      this.acting = false;
+      return result;
+    };
+
+    const promise = act(() => {
+      result = action(); // This condition checks the returned value is an actual Promise and returns it
+      // to React’s `act()` call, otherwise we just want to return `undefined`
+
+      if (isPromise(result)) {
+        return result;
+      }
+
+      return undefined;
+    });
+
+    if (isPromise(result)) {
+      updateWrapper();
+      return Promise.resolve(promise).then(afterResolve);
+    }
+
+    return afterResolve();
+  }
+
+  html() {
+    return this.withRoot(root => root.html());
+  }
+
+  text() {
+    return this.withRoot(root => root.text());
+  }
+
+  is(type) {
+    return this.withRoot(root => root.is(type));
+  }
+
+  prop(key) {
+    return this.withRoot(root => root.prop(key));
+  }
+
+  data(key) {
+    return this.withRoot(root => root.data(key));
+  }
+
+  find(type, props) {
+    return this.withRoot(root => root.find(type, props));
+  }
+
+  findAll(type, props) {
+    return this.withRoot(root => root.findAll(type, props));
+  }
+
+  findWhere(predicate) {
+    return this.withRoot(root => root.findWhere(predicate));
+  }
+
+  findAllWhere(predicate) {
+    return this.withRoot(root => root.findAllWhere(predicate));
+  }
+
+  trigger(prop, ...args) {
+    return this.withRoot(root => root.trigger(prop, ...args));
+  }
+
+  triggerKeypath(keypath, ...args) {
+    return this.withRoot(root => root.triggerKeypath(keypath, ...args));
+  }
+
+  mount() {
+    if (this.mounted) {
+      throw new Error('Attempted to mount a node that was already mounted');
+    }
+
+    if (this.element.parentNode == null) {
+      document.body.appendChild(this.element);
+      connected.add(this);
+    }
+
+    this.act(() => {
+      render( /*#__PURE__*/React.createElement(TestWrapper, {
+        render: this.render,
+        ref: wrapper => {
+          this.wrapper = wrapper;
+        }
+      }, this.tree), this.element);
+    });
+  }
+
+  unmount() {
+    if (!this.mounted) {
+      throw new Error('You attempted to unmount a node that was already unmounted');
+    }
+
+    this.ensureRoot();
+    this.act(() => unmountComponentAtNode(this.element));
+  }
+
+  destroy() {
+    const {
+      element,
+      mounted
+    } = this;
+
+    if (mounted) {
+      this.unmount();
+    }
+
+    element.remove();
+    connected.delete(this);
+  }
+
+  setProps(props) {
+    this.ensureRoot();
+    this.act(() => this.wrapper.setProps(props));
+  }
+
+  forceUpdate() {
+    this.ensureRoot();
+    this.act(() => this.wrapper.forceUpdate());
+  }
+
+  debug(options) {
+    this.ensureRoot();
+    return this.root.debug(options);
+  }
+
+  toString() {
+    return this.withRoot(root => root.toString());
+  }
+
+  update() {
+    if (this.wrapper == null) {
+      this.root = null;
+    } else {
+      const rootFiber = getInternals(this.wrapper.rootRef);
+      const topElement = fiberToElement(findCurrentFiberUsingSlowPath(rootFiber), this);
+      this.root = this.resolveRoot(topElement);
+    }
+  }
+
+  ensureRoot() {
+    if (this.wrapper == null || this.root == null) {
+      throw new Error('Attempted to operate on a mounted tree, but the component is no longer mounted');
+    }
+  }
+
+  withRoot(withRoot) {
+    this.ensureRoot();
+    return withRoot(this.root);
+  }
+
+}
+
+function defaultResolveRoot(element) {
+  return element.children[0];
+}
+
+function defaultRender(element) {
+  return element;
+}
+
+function fiberToElement(node, root) {
+  if (node.tag === Tag.HostText) {
+    return node.memoizedProps;
+  }
+
+  const props = node.memoizedProps;
+  const children = childrenToTree(node.child, root);
+  return new Element({
+    tag: node.tag,
+    type: node.type,
+    props,
+    instance: node.stateNode
+  }, children, root);
+}
+
+function childrenToTree(fiber, root) {
+  let currentFiber = fiber;
+  const children = [];
+
+  while (currentFiber != null) {
+    const result = fiberToElement(currentFiber, root);
+    children.push(result);
+    currentFiber = currentFiber.sibling;
+  }
+
+  return children;
+}
+
+function isPromise(promise) {
+  return promise != null && typeof promise === 'object' && 'then' in promise;
+}
+
+function noop() {}
+
+export { Root, connected };

package/node_modules/@shopify/react-testing/build/esm/toReactString.mjs

@@ -0,0 +1,80 @@
+import { stringify } from 'jest-matcher-utils';
+
+function toReactString(node, options = {}, level = 0) {
+  // if this is an array node then print all children at the current level
+  if (!node.type && node.children.length > 0) {
+    return node.children.map(child => toReactString(child, options, level)).join('\n');
+  }
+
+  const name = nodeName(node);
+  const indent = '  '.repeat(level);
+  const props = Object.keys(node.props) // we always filter out children no matter what, but unless allProps option
+  // is present we will also filter out insigificant props
+  .filter(key => options.allProps ? key !== 'children' : !/^(children|className)$|^(aria|data)-/.test(key)).reduce((list, key) => {
+    if (!key) {
+      return list;
+    }
+
+    const value = node.props[key];
+
+    if (value === undefined && !options.allProps) {
+      return list;
+    }
+
+    list.push(toPropString(key, value, options.verbosity));
+    return list;
+  }, []);
+  const hasChildren = node.children.length > 0 && !['svg'].includes(name);
+  const open = `${indent}<${name}${props.length > 0 ? ` ${props.join(' ')}` : ''}${hasChildren ? '>' : ' />'}`;
+
+  if (!hasChildren) {
+    return open;
+  }
+
+  const close = `${indent}</${name}>`;
+
+  if (options.depth != null && level >= options.depth) {
+    return [open, `${indent}  {/* <${node.children.length} child${node.children.length === 1 ? '' : 'ren'}... /> */}`, close].join('\n');
+  }
+
+  return [open, ...node.children.map(child => toReactString(child, options, level + 1)), close].join('\n');
+}
+function toPropString(key, value, verbosity = 1) {
+  if (value === undefined) {
+    return `${key}={undefined}`;
+  }
+
+  if (value === null) {
+    return `${key}={null}`;
+  }
+
+  if (typeof value === 'string') {
+    return `${key}="${value}"`;
+  }
+
+  if (typeof value === 'boolean' && value) {
+    return value ? `${key}` : `${key}={false}`;
+  }
+
+  if (value instanceof Array) {
+    return `${key}={${stringify(value, verbosity + 1)}}`;
+  }
+
+  return `${key}={${stringify(value, verbosity)}}`;
+}
+function nodeName({
+  type
+}) {
+  if (type && typeof type === 'object' && '_context' in type) {
+    const context = type._context;
+    return `${context.displayName || 'Context'}.${type === context.Provider ? 'Provider' : 'Consumer'}`;
+  }
+
+  if (type == null) {
+    return 'Node';
+  }
+
+  return typeof type === 'string' ? type : type.displayName || type.name || 'Component';
+}
+
+export { nodeName, toPropString, toReactString };

package/node_modules/@shopify/react-testing/build/esm/types.mjs

@@ -0,0 +1,26 @@
+// https://github.com/facebook/react/blob/master/packages/shared/ReactWorkTag.js
+let Tag;
+
+(function (Tag) {
+  Tag[Tag["FunctionComponent"] = 0] = "FunctionComponent";
+  Tag[Tag["ClassComponent"] = 1] = "ClassComponent";
+  Tag[Tag["IndeterminateComponent"] = 2] = "IndeterminateComponent";
+  Tag[Tag["HostRoot"] = 3] = "HostRoot";
+  Tag[Tag["HostPortal"] = 4] = "HostPortal";
+  Tag[Tag["HostComponent"] = 5] = "HostComponent";
+  Tag[Tag["HostText"] = 6] = "HostText";
+  Tag[Tag["Fragment"] = 7] = "Fragment";
+  Tag[Tag["Mode"] = 8] = "Mode";
+  Tag[Tag["ContextConsumer"] = 9] = "ContextConsumer";
+  Tag[Tag["ContextProvider"] = 10] = "ContextProvider";
+  Tag[Tag["ForwardRef"] = 11] = "ForwardRef";
+  Tag[Tag["Profiler"] = 12] = "Profiler";
+  Tag[Tag["SuspenseComponent"] = 13] = "SuspenseComponent";
+  Tag[Tag["MemoComponent"] = 14] = "MemoComponent";
+  Tag[Tag["SimpleMemoComponent"] = 15] = "SimpleMemoComponent";
+  Tag[Tag["LazyComponent"] = 16] = "LazyComponent";
+  Tag[Tag["IncompleteClassComponent"] = 17] = "IncompleteClassComponent";
+  Tag[Tag["DehydratedSuspenseComponent"] = 18] = "DehydratedSuspenseComponent";
+})(Tag || (Tag = {}));
+
+export { Tag };

package/node_modules/@shopify/react-testing/build/esnext/TestWrapper.esnext

@@ -0,0 +1,44 @@
+import React from 'react';
+
+class TestWrapper extends React.Component {
+  constructor(...args) {
+    super(...args);
+    this.state = {};
+    this.rootRef = null;
+
+    this.setRef = ref => {
+      this.rootRef = ref;
+    };
+  }
+
+  // eslint-disable-next-line @shopify/react-prefer-private-members
+  setProps(props) {
+    this.setState({
+      props
+    });
+  }
+
+  render() {
+    const {
+      props
+    } = this.state;
+    const {
+      children,
+      render
+    } = this.props;
+    const rootElement = props ? /*#__PURE__*/React.cloneElement(children, props) : children;
+    return render( /*#__PURE__*/React.createElement(TestInnerWrapper, {
+      ref: this.setRef
+    }, rootElement));
+  }
+
+}
+
+class TestInnerWrapper extends React.Component {
+  render() {
+    return this.props.children;
+  }
+
+}
+
+export { TestWrapper };

package/node_modules/@shopify/react-testing/build/esnext/compat.esnext

@@ -0,0 +1,10 @@
+function getInternals(instance) {
+  // In React 17+ _reactInternalFiber was renamed to _reactInternals. As such we need to handle both APIs to maintain support.
+  if ('_reactInternalFiber' in instance) {
+    return instance._reactInternalFiber;
+  }
+
+  return instance._reactInternals;
+}
+
+export { getInternals };

package/node_modules/@shopify/react-testing/build/esnext/destroy.esnext

@@ -0,0 +1,9 @@
+import { connected } from './root.esnext';
+
+function destroyAll() {
+  for (const wrapper of [...connected]) {
+    wrapper.destroy();
+  }
+}
+
+export { destroyAll };

package/node_modules/@shopify/react-testing/build/esnext/element.esnext

@@ -0,0 +1,221 @@
+import { toReactString, nodeName } from './toReactString.esnext';
+import { Tag } from './types.esnext';
+
+class Element {
+  get props() {
+    return this.tree.props;
+  }
+
+  get type() {
+    return this.tree.type;
+  }
+
+  get isDOM() {
+    return this.tree.tag === Tag.HostComponent;
+  }
+
+  get instance() {
+    return this.tree.instance;
+  }
+
+  get children() {
+    return this.elementChildren;
+  }
+
+  get elementDescendants() {
+    if (!this.descendantsCache) {
+      this.descendantsCache = getDescendants(this);
+    }
+
+    return this.descendantsCache;
+  }
+
+  get elementChildren() {
+    if (!this.elementChildrenCache) {
+      this.elementChildrenCache = this.allChildren.filter(element => typeof element !== 'string');
+    }
+
+    return this.elementChildrenCache;
+  }
+
+  get descendants() {
+    return this.elementDescendants;
+  }
+
+  get domNodes() {
+    if (this.isDOM) {
+      return [this.instance];
+    }
+
+    return this.elementChildren.filter(element => element.isDOM).map(element => element.instance);
+  }
+
+  get domNode() {
+    const {
+      domNodes
+    } = this;
+
+    if (domNodes.length > 1) {
+      throw new Error('You can’t call getDOMNode() on an element that returns multiple HTML elements. Call getDOMNodes() to retrieve all of the elements instead.');
+    }
+
+    return domNodes[0] || null;
+  }
+
+  constructor(tree, allChildren, root) {
+    this.tree = tree;
+    this.allChildren = allChildren;
+    this.root = root;
+    this.descendantsCache = null;
+    this.elementChildrenCache = null;
+  }
+
+  data(key) {
+    return this.props[key.startsWith('data-') ? key : `data-${key}`];
+  }
+
+  prop(key) {
+    return this.props[key];
+  }
+
+  text() {
+    const {
+      instance,
+      allChildren,
+      tree: {
+        tag
+      }
+    } = this;
+
+    if (tag === Tag.HostPortal) {
+      return '';
+    }
+
+    if (instance instanceof HTMLElement) {
+      return instance.textContent || '';
+    }
+
+    return allChildren.reduce((text, child) => text + (typeof child === 'string' ? child : child.text()), '');
+  }
+
+  html() {
+    const {
+      instance,
+      allChildren,
+      tree: {
+        tag
+      }
+    } = this;
+
+    if (tag === Tag.HostPortal) {
+      return '';
+    }
+
+    if (instance instanceof HTMLElement) {
+      return instance.outerHTML;
+    }
+
+    return allChildren.reduce((text, child) => text + (typeof child === 'string' ? child : child.html()), '');
+  }
+
+  is(type) {
+    return isMatchingType(this.type, type);
+  }
+
+  find(type, props) {
+    return this.elementDescendants.find(element => isMatchingType(element.type, type) && (props == null || equalSubset(props, element.props))) || null;
+  }
+
+  findAll(type, props) {
+    return this.elementDescendants.filter(element => isMatchingType(element.type, type) && (props == null || equalSubset(props, element.props)));
+  }
+
+  findWhere(predicate) {
+    return this.elementDescendants.find(element => predicate(element)) || null;
+  }
+
+  findAllWhere(predicate) {
+    return this.elementDescendants.filter(element => predicate(element));
+  }
+
+  trigger(prop, ...args) {
+    return this.root.act(() => {
+      const propValue = this.props[prop];
+
+      if (propValue == null) {
+        throw new Error(`Attempted to call prop ${prop} but it was not defined.`);
+      }
+
+      return propValue(...args);
+    });
+  }
+
+  triggerKeypath(keypath, ...args) {
+    return this.root.act(() => {
+      const {
+        props
+      } = this;
+      const parts = keypath.split(/[.[\]]/g).filter(Boolean);
+      let currentProp = props;
+      const currentKeypath = [];
+
+      for (const part of parts) {
+        if (currentProp == null || typeof currentProp !== 'object') {
+          throw new Error(`Attempted to access field keypath '${currentKeypath.join('.')}', but it was not an object.`);
+        }
+
+        currentProp = currentProp[part];
+        currentKeypath.push(part);
+      }
+
+      if (typeof currentProp !== 'function') {
+        throw new Error(`Value at keypath '${keypath}' is not a function.`);
+      }
+
+      return currentProp(...args);
+    });
+  }
+
+  debug(options) {
+    return toReactString(this, options);
+  }
+
+  toString() {
+    return `<${nodeName(this)} />`;
+  }
+
+}
+
+function isMatchingType(type, test) {
+  if (type === test) {
+    return true;
+  }
+
+  if (test == null) {
+    return false;
+  }
+
+  return test.type != null && isMatchingType(type, test.type);
+}
+
+function equalSubset(subset, full) {
+  return Object.keys(subset).every(key => key in full && full[key] === subset[key]);
+}
+
+function getDescendants(element) {
+  const descendants = []; // eslint-disable-next-line @typescript-eslint/prefer-for-of
+
+  for (let i = 0; i < element.allChildren.length; i++) {
+    const child = element.allChildren[i];
+
+    if (typeof child !== 'string') {
+      descendants.push(child); // eslint-disable-next-line prefer-spread
+
+      descendants.push.apply(descendants, child.elementDescendants);
+    }
+  }
+
+  return descendants;
+}
+
+export { Element };

package/node_modules/@shopify/react-testing/build/esnext/index.esnext

@@ -0,0 +1,5 @@
+export { Root } from './root.esnext';
+export { Element } from './element.esnext';
+export { CustomRoot, createMount, mount } from './mount.esnext';
+export { destroyAll } from './destroy.esnext';
+export { nodeName, toPropString, toReactString } from './toReactString.esnext';