#[v5-beta] Extract states ID & events ID

1 messages · Page 1 of 1 (latest)

dire wharf
#

Hi! First a huge thanks for all your works, it's really brilliant and drastically changes the way I code for js projects.

Version:

"@xstate/test": "1.0.0-beta.4",
"xstate": "5.0.0-beta.33",

My question is:
Is there a proper way to extract states ID and events ID as an union type? especially for createTestMachine
My code if it can helps:

const advancedAddToCartMachine = createTestMachine({
  initial: 'onProductPage',
  id: 'advancedAddToCartMachine',
  context: {},
  states: {
     // This act as an entrypoint to populate all the paths 🤩
    onProductPage: {
      on: {
        ADD_TO_CART: 'cartDrawer.visible',
        BUY_NOW: 'inCheckout',
      },
    },
    cartDrawer: {
      initial: 'hidden',
      states: {
        hidden: {
          on: {
            CLICK_ON_CART_ICON: '#advancedAddToCartMachine.inCartPage',
          }
        },
        visible: {
          on: {
            CHECK_PRODUCT_ADDED_TO_CART: '#advancedAddToCartMachine.productAddedToCart',
            CLICK_ON_HIDE_CART: 'hidden',
            CLICK_ON_VIEW_CART_PAGE_BUTTON: '#advancedAddToCartMachine.inCartPage',
          }
        }
      },
      on: {
        CHECK_PRODUCT_ADDED_TO_CART: 'productAddedToCart',
      },
    },
    productAddedToCart: {
      on: {
        GO_TO_CHECKOUT: 'inCheckout',
      },
    },
    inCartPage: {},
    inCheckout: {
      type: 'final',
    },
  },
}

Because I'd like to type the object with the concrete playwright implementation:

const advancedAddToCartMachinePlaywrightStatesAndEventsFactory = (page: Page) => {
  return {
    states: {
      inCartPage: {
        decoratedHandler: async () => {},
        meta: {
          urlRegex: new RegExp(`^${baseShopUrl.replace(/[-\/\\^$*+?.()|[\]{}]/g, '\\$&')}/cart`, 'i'),
          waitFor: true,
          expectUrl: true,
        }
      },
      // ...

Thanks!

#

[v5-beta] Extract states ID & events ID

mystic marlin
#

Hi! First a huge thanks for all your works, it's really brilliant and drastically changes the way I code for js projects.

Really appreciate this!

Is there a proper way to extract states ID and events ID as an union type?

Not yet but soon. @restive vale has an in-progress PR which will make the state value type inferred and available.