@shopify/ui-extensions-server-kit 5.2.0

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

@@ -0,0 +1,221 @@
+import { toReactString, nodeName } from './toReactString.mjs';
+import { Tag } from './types.mjs';
+
+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/esm/index.mjs

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

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

@@ -0,0 +1,41 @@
+import { matcherHint, RECEIVED_COLOR, EXPECTED_COLOR, printExpected } from 'jest-matcher-utils';
+import { assertIsNode, assertIsType, printType, diffs, pluralize } from './utilities.mjs';
+
+function toContainReactComponent(node, type, props) {
+  assertIsNode(node, {
+    expectation: 'toContainReactComponent',
+    isNot: this.isNot
+  });
+  assertIsType(type, {
+    expectation: 'toContainReactComponent',
+    isNot: this.isNot
+  });
+  const foundByType = node.findAll(type);
+  const foundByProps = props == null ? foundByType : foundByType.filter(element => Object.keys(props).every(key => this.equals(props[key], element.props[key])));
+  const pass = foundByProps.length > 0;
+  const message = pass ? () => `${matcherHint('.not.toContainReactComponent')}\n\n` + `Expected the React element:\n  ${RECEIVED_COLOR(node.toString())}\n` + `Not to contain component:\n  ${EXPECTED_COLOR(printType(type))}\n${props ? `With props matching:\n  ${printExpected(props)}\n` : ''}` + `But ${foundByProps.length} matching ${printType(type)} ${foundByProps.length === 1 ? 'elements were' : 'element was'} found.\n` : () => `${`${matcherHint('.toContainReactComponent')}\n\n` + `Expected the React element:\n  ${RECEIVED_COLOR(node.toString())}\n` + `To contain component:\n  ${EXPECTED_COLOR(printType(type))}\n${props ? `With props matching:\n  ${printExpected(props)}\n` : ''}`}${foundByType.length === 0 ? `But no matching ${printType(type)} elements were found.\n` : `But the ${foundByType.length === 1 ? 'found element has' : 'found elements have'} the following prop differences:\n\n${diffs(foundByType, props, this.expand)}`}`;
+  return {
+    pass,
+    message
+  };
+}
+function toContainReactComponentTimes(node, type, times, props) {
+  assertIsNode(node, {
+    expectation: 'toContainReactComponentTimes',
+    isNot: this.isNot
+  });
+  assertIsType(type, {
+    expectation: 'toContainReactComponent',
+    isNot: this.isNot
+  });
+  const foundByType = node.findAll(type);
+  const foundByProps = props == null ? foundByType : foundByType.filter(element => Object.keys(props).every(key => this.equals(props[key], element.props[key])));
+  const pass = foundByProps.length === times;
+  const message = pass ? () => [`${matcherHint('.not.toContainReactComponentTimes')}\n`, `Expected the React element:\n  ${RECEIVED_COLOR(node.toString())}`, `Not to contain component:\n  ${EXPECTED_COLOR(printType(type))}`, `${times} ${pluralize('time', times)}, but it did.`].join('\n') : () => [`${matcherHint('.toContainReactComponentTimes')}\n`, `Expected the React element:\n  ${RECEIVED_COLOR(node.toString())}`, `To contain component:\n  ${EXPECTED_COLOR(printType(type))}`, `${times} ${pluralize('time', times)}, but it was found ${foundByProps.length}.`].join('\n');
+  return {
+    pass,
+    message
+  };
+}
+
+export { toContainReactComponent, toContainReactComponentTimes };

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

@@ -0,0 +1,21 @@
+import { matcherHint, RECEIVED_COLOR, EXPECTED_COLOR, printExpected } from 'jest-matcher-utils';
+import { assertIsNode, printType, diffs } from './utilities.mjs';
+
+function toProvideReactContext(node, Context, value) {
+  assertIsNode(node, {
+    expectation: 'toProvideReactContext',
+    isNot: this.isNot
+  });
+  const foundByType = node.findAll(Context.Provider);
+  const foundByValue = value == null ? foundByType : foundByType.filter(element => this.equals(value, element.prop('value')));
+  const pass = foundByValue.length > 0;
+  const message = pass ? () => `${matcherHint('.not.toProvideReactContext')}\n\n` + `Expected the React element:\n  ${RECEIVED_COLOR(node.toString())}\n` + `Not to contain context provider:\n  ${EXPECTED_COLOR(printType(Context.Provider))}\n${value ? `With value matching:\n  ${printExpected(value)}\n` : ''}` + `But ${foundByValue.length} matching ${printType(Context.Provider)}${foundByValue.length === 1 ? 's were' : ' was'} found.\n` : () => `${`${matcherHint('.toProvideReactContext')}\n\n` + `Expected the React element:\n  ${RECEIVED_COLOR(node.toString())}\n` + `To contain context provider:\n  ${EXPECTED_COLOR(printType(Context.Provider))}\n${value ? `With value matching:\n  ${printExpected(value)}\n` : ''}`}${foundByType.length === 0 ? `But no matching ${printType(Context.Provider)}s were found.\n` : `But the ${foundByType.length === 1 ? 'found provider has' : 'found provider have'} had different values:\n\n${diffs(foundByType, {
+    value
+  }, this.expand)}`}`;
+  return {
+    pass,
+    message
+  };
+}
+
+export { toProvideReactContext };

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

@@ -0,0 +1,14 @@
+import { toHaveReactProps, toHaveReactDataProps } from './props.mjs';
+import { toContainReactComponent, toContainReactComponentTimes } from './components.mjs';
+import { toProvideReactContext } from './context.mjs';
+import { toContainReactText, toContainReactHtml } from './strings.mjs';
+
+expect.extend({
+  toHaveReactProps,
+  toHaveReactDataProps,
+  toContainReactComponent,
+  toContainReactComponentTimes,
+  toContainReactText,
+  toContainReactHtml,
+  toProvideReactContext
+});

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

@@ -0,0 +1,33 @@
+import { matcherHint, RECEIVED_COLOR, printExpected, printReceived } from 'jest-matcher-utils';
+import { assertIsNode, diffPropsForNode } from './utilities.mjs';
+
+function toHaveReactProps(node, props) {
+  assertIsNode(node, {
+    expectation: 'toHaveReactProps',
+    isNot: this.isNot
+  });
+
+  if (props == null || typeof props !== 'object') {
+    return {
+      pass: false,
+      message: () => `You passed ${props == null ? String(props) : `a ${typeof props}`} as props, but it must be an object.`
+    };
+  }
+
+  const pass = Object.keys(props).every(key => this.equals(props[key], node.props[key]));
+  const message = pass ? () => `${matcherHint('.not.toHaveReactProps', node.toString())}\n\n` + `Expected the React element:\n  ${RECEIVED_COLOR(node.toString())}\n` + `Not to have props:\n  ${printExpected(props)}\n` + `Received:\n  ${printReceived(node.props)}\n` : () => {
+    const diffString = diffPropsForNode(node, props, {
+      expand: this.expand
+    });
+    return `${matcherHint('.toHaveReactProps', node.toString())}\n\n` + `Expected the React element:\n  ${RECEIVED_COLOR(node.toString())}\n` + `To have props:\n  ${printExpected(props)}\n` + `Received:\n  ${printReceived(node.props)}\n${diffString ? `Difference:\n${diffString}\n` : ''}`;
+  };
+  return {
+    pass,
+    message
+  };
+}
+function toHaveReactDataProps(node, data) {
+  return toHaveReactProps.call(this, node, data);
+}
+
+export { toHaveReactDataProps, toHaveReactProps };

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

@@ -0,0 +1,37 @@
+import { matcherHint, RECEIVED_COLOR, printExpected, INVERTED_COLOR, printReceived } from 'jest-matcher-utils';
+import { assertIsNode } from './utilities.mjs';
+
+function toContainReactText(node, text) {
+  assertIsNode(node, {
+    expectation: 'toContainReactText',
+    isNot: this.isNot
+  });
+  const nodeText = node.text();
+  const matchIndex = nodeText.indexOf(text);
+  const pass = matchIndex >= 0;
+  const message = pass ? () => `${matcherHint('.not.toContainReactText', node.toString())}\n\n` + `Expected the React element:\n  ${RECEIVED_COLOR(node.toString())}\n` + `Not to contain text:\n  ${printExpected(text)}\n` + `But it did:\n  ${printReceivedWithHighlight(nodeText, matchIndex, text.length)}\n` : () => `${matcherHint('.not.toContainReactText', node.toString())}\n\n` + `Expected the React element:\n  ${RECEIVED_COLOR(node.toString())}\n` + `With text content:\n  ${printReceived(nodeText)}\n` + `To contain string:\n  ${printExpected(text)}\n`;
+  return {
+    pass,
+    message
+  };
+}
+function toContainReactHtml(node, text) {
+  assertIsNode(node, {
+    expectation: 'toContainReactHtml',
+    isNot: this.isNot
+  });
+  const nodeHtml = node.html();
+  const matchIndex = nodeHtml.indexOf(text);
+  const pass = matchIndex >= 0;
+  const message = pass ? () => `${matcherHint('.not.toContainReactHtml', node.toString())}\n\n` + `Expected the React element:\n  ${RECEIVED_COLOR(node.toString())}\n` + `Not to contain HTML:\n  ${printExpected(text)}\n` + `But it did:\n  ${printReceivedWithHighlight(nodeHtml, matchIndex, text.length)}\n` : () => `${matcherHint('.not.toContainReactHtml', node.toString())}\n\n` + `Expected the React element:\n  ${RECEIVED_COLOR(node.toString())}\n` + `With HTML content:\n  ${printReceived(nodeHtml)}\n` + `To contain HTML:\n  ${printExpected(text)}\n`;
+  return {
+    pass,
+    message
+  };
+}
+
+function printReceivedWithHighlight(text, start, length) {
+  return RECEIVED_COLOR(`"${text.slice(0, start)}${INVERTED_COLOR(text.slice(start, start + length))}${text.slice(start + length)}"`);
+}
+
+export { toContainReactHtml, toContainReactText };

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

@@ -0,0 +1,101 @@
+import { diff, matcherErrorMessage, matcherHint, RECEIVED_COLOR, printWithType, printReceived, printExpected } from 'jest-matcher-utils';
+import { Root } from '../root.mjs';
+import { Element } from '../element.mjs';
+
+function assertIsNode(node, {
+  expectation,
+  isNot
+}) {
+  if (node == null) {
+    throw new Error(matcherErrorMessage(matcherHint(`.${expectation}`, undefined, undefined, {
+      isNot
+    }), `${RECEIVED_COLOR('received')} value must be an @shopify/react-testing Root or Element object`, `Received ${RECEIVED_COLOR('null')}.\nThis usually means that your \`.findX\` method failed to find any matching elements.`));
+  }
+
+  if (Array.isArray(node) && node.length > 1 && (node[0] instanceof Root || node[0] instanceof Element)) {
+    throw new Error(matcherErrorMessage(matcherHint(`.${expectation}`, undefined, undefined, {
+      isNot
+    }), `${RECEIVED_COLOR('received')} value must be an @shopify/react-testing Root or Element object`, `Received an ${RECEIVED_COLOR('array of Root or Element objects')}.\nThis usually means that you passed in the result of \`.findAllX\`. Pass the result of \`.findX\` instead.`));
+  }
+
+  if (!(node instanceof Root) && !(node instanceof Element)) {
+    throw new Error(matcherErrorMessage(matcherHint(`.${expectation}`, undefined, undefined, {
+      isNot
+    }), `${RECEIVED_COLOR('received')} value must be an @shopify/react-testing Root or Element object`, printWithType('Received', node, printReceived)));
+  }
+}
+function assertIsType(type, {
+  expectation,
+  isNot
+}) {
+  if (type == null) {
+    throw new Error(matcherErrorMessage(matcherHint(`.${expectation}`, undefined, undefined, {
+      isNot
+    }), `${RECEIVED_COLOR('expected')} value must be a string or a valid React component.`, printWithType('Expected', type, printExpected)));
+  }
+}
+function diffs(element, props, expand) {
+  return element.reduce((diffs, element, index) => {
+    const separator = index === 0 ? '' : '\n\n';
+    return `${diffs}${separator}${normalizedDiff(element, props, {
+      expand,
+      showLegend: index === 0
+    })}`;
+  }, '');
+}
+
+function normalizedDiff(element, props, {
+  expand = false,
+  showLegend = false
+}) {
+  const result = diffPropsForNode(element, props, {
+    expand
+  }) || '';
+  return showLegend ? result : result.split('\n\n')[1];
+}
+
+function printType(type) {
+  if (typeof type === 'object' && '_context' in type) {
+    const context = type._context;
+    const componentName = type === context.Provider ? 'Provider' : 'Consumer';
+
+    const _displayName = context.displayName || 'Context';
+
+    return `<${_displayName}.${componentName} />`;
+  }
+
+  const displayName = typeof type === 'string' ? type : type.displayName || type.name || 'Component';
+  return `<${displayName} />`;
+}
+function diffPropsForNode(node, props, {
+  expand = false
+}) {
+  return diff(props, getObjectSubset(node.props, props), {
+    expand
+  });
+} // Original from https://github.com/facebook/jest/blob/master/packages/expect/src/utils.ts#L107
+
+function getObjectSubset(object, subset) {
+  if (Array.isArray(object)) {
+    if (Array.isArray(subset) && subset.length === object.length) {
+      return subset.map((sub, i) => getObjectSubset(object[i], sub));
+    }
+  } else if (object instanceof Date) {
+    return object;
+  } else if (typeof object === 'object' && object !== null && typeof subset === 'object' && subset !== null) {
+    const trimmed = {};
+    Object.keys(subset).filter(key => Reflect.has(object, key)).forEach(key => trimmed[key] = getObjectSubset(object[key], subset[key]));
+
+    if (Object.keys(trimmed).length > 0) {
+      return trimmed;
+    }
+  }
+
+  return object;
+}
+
+function pluralize(word, count) {
+  return count === 1 ? word : `${word}s`;
+}
+
+export { assertIsNode, assertIsType, diffPropsForNode, diffs, pluralize, printType };

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

@@ -0,0 +1,70 @@
+import { objectSpread2 as _objectSpread2 } from './_virtual/_rollupPluginBabelHelpers.mjs';
+import { Root } from './root.mjs';
+export { Root } from './root.mjs';
+
+function mount(element) {
+  return new Root(element);
+}
+class CustomRoot extends Root {
+  constructor(tree, context, options) {
+    super(tree, options);
+    this.context = context;
+  }
+
+}
+function createMount({
+  render,
+  context: createContext = defaultContext,
+  afterMount = defaultAfterMount,
+  cleanup
+}) {
+  function mount(element, options = {}) {
+    const context = createContext(options);
+    const wrapper = new CustomRoot(element, context, {
+      render: element => render(element, context, options),
+      resolveRoot: root => root.find(element.type)
+    });
+
+    if (cleanup) {
+      const originalDestroy = wrapper.destroy.bind(wrapper);
+
+      wrapper.destroy = () => {
+        cleanup(wrapper, options);
+        originalDestroy();
+      };
+    }
+
+    const afterMountResult = afterMount(wrapper, options);
+    return afterMountResult != null && 'then' in afterMountResult ? afterMountResult.then(() => wrapper) : wrapper;
+  }
+
+  Reflect.defineProperty(mount, 'extend', {
+    writable: false,
+    value: ({
+      context: createAdditionalContext = defaultContext,
+      render: additionalRender,
+      afterMount: additionalAfterMount = defaultAfterMount
+    }) => {
+      return createMount({
+        context: options => _objectSpread2(_objectSpread2({}, createContext(options)), createAdditionalContext(options)),
+        render: (element, context, options) => render(additionalRender(element, context, options), context, options),
+        afterMount: (wrapper, options) => {
+          const result = additionalAfterMount(wrapper, options);
+
+          const finalResult = () => afterMount(wrapper, options);
+
+          return result != null && 'then' in result ? result.then(finalResult) : finalResult();
+        }
+      });
+    }
+  });
+  return mount;
+}
+
+function defaultContext() {
+  return {};
+}
+
+function defaultAfterMount() {}
+
+export { CustomRoot, createMount, mount };