Remove most traces of data-cy attributes

2024-10-06 04:54:52 +13:00 · 2023-02-01 08:20:46 +00:00 · 2023-02-01 08:20:46 +00:00 · 6e12c3fa3c
commit 6e12c3fa3c
parent 746d08cb70
51 changed files with 46 additions and 200 deletions
--- a/packages/bbui/src/ActionButton/ActionButton.svelte
+++ b/packages/bbui/src/ActionButton/ActionButton.svelte
@ -9,7 +9,6 @@
  export let longPressable = false
  export let disabled = false
  export let icon = ""
-  export let dataCy = null
  export let size = "M"
  export let active = false
  export let fullWidth = false
@ -37,7 +36,6 @@
 </script>

 <button
-  data-cy={dataCy}
  use:longPress
  class:spectrum-ActionButton--quiet={quiet}
  class:spectrum-ActionButton--emphasized={emphasized}
--- a/packages/bbui/src/ActionMenu/ActionMenu.svelte
+++ b/packages/bbui/src/ActionMenu/ActionMenu.svelte
@ -6,7 +6,6 @@
  export let disabled = false
  export let align = "left"
  export let portalTarget
-  export let dataCy

  let anchor
  let dropdown
@ -37,7 +36,7 @@
 <div use:getAnchor on:click={openMenu}>
  <slot name="control" />
 </div>
-<Popover bind:this={dropdown} {anchor} {align} {portalTarget} {dataCy}>
+<Popover bind:this={dropdown} {anchor} {align} {portalTarget}>
  <Menu>
    <slot />
  </Menu>
--- a/packages/bbui/src/Button/Button.svelte
+++ b/packages/bbui/src/Button/Button.svelte
@ -13,7 +13,6 @@
  export let icon = undefined
  export let active = false
  export let tooltip = undefined
-  export let dataCy
  export let newStyles = true
  export let id

@ -33,7 +32,6 @@
  class:disabled
  class="spectrum-Button spectrum-Button--size{size.toUpperCase()}"
  {disabled}
-  data-cy={dataCy}
  on:click|preventDefault
  on:mouseover={() => (showTooltip = true)}
  on:focus={() => (showTooltip = true)}
--- a/packages/bbui/src/Form/Core/EnvDropdown.svelte
+++ b/packages/bbui/src/Form/Core/EnvDropdown.svelte
@ -11,7 +11,6 @@
  export let id = null
  export let readonly = false
  export let updateOnChange = true
-  export let dataCy
  export let align
  export let autofocus = false
  export let variables
@ -123,7 +122,6 @@
      disabled={hbsValue.length || disabled}
      {readonly}
      {id}
-      data-cy={dataCy}
      value={hbsValue.length ? `{{ ${hbsValue[0]} }}` : value}
      placeholder={placeholder || ""}
      on:click
--- a/packages/bbui/src/Form/Core/Switch.svelte
+++ b/packages/bbui/src/Form/Core/Switch.svelte
@ -6,7 +6,6 @@
  export let id = null
  export let text = null
  export let disabled = false
-  export let dataCy = null

  const dispatch = createEventDispatcher()
  const onChange = event => {
@ -16,7 +15,6 @@

 <div class="spectrum-Switch spectrum-Switch--emphasized">
  <input
-    data-cy={dataCy}
    checked={value}
    {disabled}
    on:change={onChange}
--- a/packages/bbui/src/Form/Core/TextField.svelte
+++ b/packages/bbui/src/Form/Core/TextField.svelte
@ -11,7 +11,6 @@
  export let readonly = false
  export let updateOnChange = true
  export let quiet = false
-  export let dataCy
  export let align
  export let autofocus = false

@ -89,7 +88,6 @@
    {disabled}
    {readonly}
    {id}
-    data-cy={dataCy}
    value={value || ""}
    placeholder={placeholder || ""}
    on:click
--- a/packages/bbui/src/Form/EnvDropdown.svelte
+++ b/packages/bbui/src/Form/EnvDropdown.svelte
@ -13,7 +13,6 @@
  export let error = null
  export let updateOnChange = true
  export let quiet = false
-  export let dataCy
  export let autofocus
  export let variables
  export let showModal
@ -28,7 +27,6 @@

 <Field {label} {labelPosition} {error}>
  <EnvDropdown
-    {dataCy}
    {updateOnChange}
    {error}
    {disabled}
--- a/packages/bbui/src/Form/Input.svelte
+++ b/packages/bbui/src/Form/Input.svelte
@ -13,7 +13,6 @@
  export let error = null
  export let updateOnChange = true
  export let quiet = false
-  export let dataCy
  export let autofocus

  const dispatch = createEventDispatcher()
@ -25,7 +24,6 @@

 <Field {label} {labelPosition} {error}>
  <TextField
-    {dataCy}
    {updateOnChange}
    {error}
    {disabled}
--- a/packages/bbui/src/Form/InputDropdown.svelte
+++ b/packages/bbui/src/Form/InputDropdown.svelte
@ -14,7 +14,6 @@
  export let error = null
  export let updateOnChange = true
  export let quiet = false
-  export let dataCy
  export let autofocus
  export let options = []

@ -32,7 +31,6 @@

 <Field {label} {labelPosition} {error}>
  <InputDropdown
-    {dataCy}
    {updateOnChange}
    {error}
    {disabled}
--- a/packages/bbui/src/Form/PickerDropdown.svelte
+++ b/packages/bbui/src/Form/PickerDropdown.svelte
@ -21,7 +21,6 @@
  export let getSecondaryOptionColour = () => {}
  export let getSecondaryOptionIcon = () => {}
  export let quiet = false
-  export let dataCy
  export let autofocus
  export let primaryOptions = []
  export let secondaryOptions = []
@ -98,7 +97,6 @@
  <PickerDropdown
    {searchTerm}
    {autocomplete}
-    {dataCy}
    {error}
    {disabled}
    {readonly}
--- a/packages/bbui/src/Form/Toggle.svelte
+++ b/packages/bbui/src/Form/Toggle.svelte
@ -9,7 +9,6 @@
  export let text = null
  export let disabled = false
  export let error = null
-  export let dataCy = null

  const dispatch = createEventDispatcher()
  const onChange = e => {
@ -19,5 +18,5 @@
 </script>

 <Field {label} {labelPosition} {error}>
-  <Switch {dataCy} {error} {disabled} {text} {value} on:change={onChange} />
+  <Switch {error} {disabled} {text} {value} on:change={onChange} />
 </Field>
--- a/packages/bbui/src/Menu/Item.svelte
+++ b/packages/bbui/src/Menu/Item.svelte
@ -5,7 +5,6 @@
  const dispatch = createEventDispatcher()
  const actionMenu = getContext("actionMenu")

-  export let dataCy
  export let icon = undefined
  export let disabled = undefined
  export let noClose = false
@ -35,7 +34,6 @@
 </script>

 <li
-  data-cy={dataCy}
  on:click|preventDefault={disabled ? null : onClick}
  class="spectrum-Menu-item"
  class:is-disabled={disabled}
--- a/packages/bbui/src/Modal/ModalContent.svelte
+++ b/packages/bbui/src/Modal/ModalContent.svelte
@ -23,7 +23,7 @@
  export let secondaryButtonText = undefined
  export let secondaryAction = undefined
  export let secondaryButtonWarning = false
-  export let dataCy = null
+
  const { hide, cancel } = getContext(Context.Modal)
  let loading = false
  $: confirmDisabled = disabled || loading
@ -63,7 +63,6 @@
  role="dialog"
  tabindex="-1"
  aria-modal="true"
-  data-cy={dataCy}
 >
  <div class="spectrum-Dialog-grid">
    {#if title || $$slots.header}
--- a/packages/bbui/src/Popover/Popover.svelte
+++ b/packages/bbui/src/Popover/Popover.svelte
@ -13,7 +13,6 @@
  export let anchor
  export let align = "right"
  export let portalTarget
-  export let dataCy
  export let maxWidth
  export let direction = "bottom"
  export let showTip = false
@ -79,7 +78,6 @@
      on:keydown={handleEscape}
      class={"spectrum-Popover is-open " + (tooltipClasses || "")}
      role="presentation"
-      data-cy={dataCy}
      transition:fly|local={{ y: -20, duration: 200 }}
    >
      <slot />
--- a/packages/bbui/src/SideNavigation/Item.svelte
+++ b/packages/bbui/src/SideNavigation/Item.svelte
@ -8,7 +8,6 @@
  export let icon = ""
  export let selected = false
  export let disabled = false
-  export let dataCy
  export let badge = ""
 </script>

@ -17,7 +16,6 @@
  class:is-selected={selected}
  class:is-disabled={disabled}
  on:click
-  data-cy={dataCy}
 >
  {#if heading}
    <h2 class="spectrum-SideNav-heading" id="nav-heading-{heading}">
--- a/packages/builder/src/components/backend/DataTable/RowFieldControl.svelte
+++ b/packages/builder/src/components/backend/DataTable/RowFieldControl.svelte
@ -42,13 +42,7 @@
 </script>

 {#if type === "options" && meta.constraints.inclusion.length !== 0}
-  <Select
-    {label}
-    data-cy="{meta.name}-select"
-    bind:value
-    options={meta.constraints.inclusion}
-    sort
-  />
+  <Select {label} bind:value options={meta.constraints.inclusion} sort />
 {:else if type === "datetime"}
  <DatePicker
    {error}
@ -61,7 +55,7 @@
 {:else if type === "attachment"}
  <Dropzone {label} {error} bind:value />
 {:else if type === "boolean"}
-  <Toggle text={label} {error} bind:value data-cy="{meta.name}-input" />
+  <Toggle text={label} {error} bind:value />
 {:else if type === "array" && meta.constraints.inclusion.length !== 0}
  <Multiselect
    bind:value
@ -87,12 +81,5 @@
    {error}
  />
 {:else}
-  <Input
-    {label}
-    data-cy="{meta.name}-input"
-    {type}
-    {error}
-    bind:value
-    disabled={readonly}
-  />
+  <Input {label} {type} {error} bind:value disabled={readonly} />
 {/if}
--- a/packages/builder/src/components/backend/DataTable/modals/CreateEditColumn.svelte
+++ b/packages/builder/src/components/backend/DataTable/modals/CreateEditColumn.svelte
@ -546,9 +546,5 @@
    Your data will be deleted and this action cannot be undone - enter the column
    name to confirm.
  </p>
-  <Input
-    dataCy="delete-column-confirm"
-    bind:value={deleteColName}
-    placeholder={originalName}
-  />
+  <Input bind:value={deleteColName} placeholder={originalName} />
 </ConfirmDialog>
--- a/packages/builder/src/components/backend/DataTable/modals/CreateEditUser.svelte
+++ b/packages/builder/src/components/backend/DataTable/modals/CreateEditUser.svelte
@ -119,7 +119,6 @@
       selection is always undefined -->
  <Select
    label="Role"
-    data-cy="roleId-select"
    bind:value={row.roleId}
    options={$roles}
    getOptionLabel={role => role.name}
--- a/packages/builder/src/components/backend/DataTable/modals/EditRow.svelte
+++ b/packages/builder/src/components/backend/DataTable/modals/EditRow.svelte
@ -13,7 +13,7 @@
  }
 </script>

-<Button data-cy="edit-row" secondary small on:click={showModal}>Edit</Button>
+<Button secondary small on:click={showModal}>Edit</Button>
 <Modal bind:this={modal}>
  <svelte:component this={modalContentComponent} {row} />
 </Modal>
--- a/packages/builder/src/components/backend/DatasourceNavigator/modals/UpdateDatasourceModal.svelte
+++ b/packages/builder/src/components/backend/DatasourceNavigator/modals/UpdateDatasourceModal.svelte
@ -47,7 +47,6 @@
    disabled={error || !name || !datasource?.type}
  >
    <Input
-      data-cy="datasource-name-input"
      label="Datasource Name"
      on:input={checkValid}
      bind:value={name}
--- a/packages/builder/src/components/backend/TableNavigator/ListItem.svelte
+++ b/packages/builder/src/components/backend/TableNavigator/ListItem.svelte
@ -6,13 +6,7 @@
  export let indented
 </script>

-<div
-  data-cy="table-nav-item"
-  class:indented
-  class:selected
-  on:click
-  class={className}
->
+<div class:indented class:selected on:click class={className}>
  <i class={icon} />
  <span>{title}</span>
  <slot />
--- a/packages/builder/src/components/backend/TableNavigator/modals/CreateTableModal.svelte
+++ b/packages/builder/src/components/backend/TableNavigator/modals/CreateTableModal.svelte
@ -102,7 +102,6 @@
  disabled={error || !name || (rows.length && !allValid)}
 >
  <Input
-    data-cy="table-name-input"
    thin
    label="Table Name"
    on:input={checkValid}
--- a/packages/builder/src/components/backend/TableNavigator/popovers/EditTablePopover.svelte
+++ b/packages/builder/src/components/backend/TableNavigator/popovers/EditTablePopover.svelte
@ -134,11 +134,7 @@
    This action cannot be undone - to continue please enter the table name below
    to confirm.
  </p>
-  <Input
-    bind:value={deleteTableName}
-    placeholder={table.name}
-    dataCy="delete-table-confirm"
-  />
+  <Input bind:value={deleteTableName} placeholder={table.name} />
 </ConfirmDialog>

 <style>
--- a/packages/builder/src/components/common/AppLockModal.svelte
+++ b/packages/builder/src/components/common/AppLockModal.svelte
@ -74,7 +74,6 @@
 <Modal bind:this={appLockModal}>
  <ModalContent
    title={lockedByHeading}
-    dataCy={"app-lock-modal"}
    showConfirmButton={false}
    showCancelButton={false}
  >
--- a/packages/builder/src/components/common/ConfirmDialog.svelte
+++ b/packages/builder/src/components/common/ConfirmDialog.svelte
@ -9,7 +9,6 @@
  export let onCancel = undefined
  export let warning = true
  export let disabled
-  export let dataCy = null

  let modal

@ -29,7 +28,6 @@
    {cancelText}
    {warning}
    {disabled}
-    {dataCy}
  >
    <Body size="S">
      {body}
--- a/packages/builder/src/components/common/DashCard.svelte
+++ b/packages/builder/src/components/common/DashCard.svelte
@ -4,12 +4,11 @@
  export let title = ""
  export let actionIcon
  export let action
-  export let dataCy

  $: actionDefined = typeof action === "function"
 </script>

-<div class="dash-card" data-cy={dataCy}>
+<div class="dash-card">
  <div class="dash-card-header" class:active={actionDefined} on:click={action}>
    <span class="dash-card-title">
      <Detail size="M">{title}</Detail>
--- a/packages/builder/src/components/common/TemplateDisplay.svelte
+++ b/packages/builder/src/components/common/TemplateDisplay.svelte
@ -68,7 +68,7 @@
  <div class="template-categories">
    <Layout gap="XL" noPadding>
      {#each filteredCategories as category}
-        <div class="template-category" data-cy={category.name}>
+        <div class="template-category">
          <Detail size="M">{category.name}</Detail>
          <div class="template-grid">
            {#each category.templates as templateEntry}
--- a/packages/builder/src/components/common/bindings/DrawerBindableCombobox.svelte
+++ b/packages/builder/src/components/common/bindings/DrawerBindableCombobox.svelte
@ -66,11 +66,7 @@
    {error}
  />
  {#if !disabled}
-    <div
-      class="icon"
-      on:click={bindingDrawer.show}
-      data-cy="text-binding-button"
-    >
+    <div class="icon" on:click={bindingDrawer.show}>
      <Icon size="S" name="FlashOn" />
    </div>
  {/if}
--- a/packages/builder/src/components/common/inputs/CopyInput.svelte
+++ b/packages/builder/src/components/common/inputs/CopyInput.svelte
@ -3,7 +3,6 @@

  export let label = null
  export let value
-  export let dataCy = null

  const copyToClipboard = val => {
    const dummy = document.createElement("textarea")
@ -16,7 +15,7 @@
  }
 </script>

-<div data-cy={dataCy}>
+<div>
  <Input readonly {value} {label} />
  <div class="icon" on:click={() => copyToClipboard(value)}>
    <Icon size="S" name="Copy" />
--- a/packages/builder/src/components/deploy/DeployModal.svelte
+++ b/packages/builder/src/components/deploy/DeployModal.svelte
@ -66,7 +66,6 @@
    title="Publish to production"
    confirmText="Publish"
    onConfirm={publishApp}
-    dataCy={"deploy-app-modal"}
  >
    The changes you have made will be published to the production version of the
    application.
@ -88,12 +87,7 @@

 <!-- Publish complete -->
 <Modal bind:this={publishCompleteModal}>
-  <ModalContent
-    confirmText="Done"
-    cancelText="View App"
-    onCancel={viewApp}
-    dataCy="deploy-app-success-modal"
-  >
+  <ModalContent confirmText="Done" cancelText="View App" onCancel={viewApp}>
    <div slot="header" class="app-published-header">
      <svg
        width="26px"
@ -105,11 +99,7 @@
      </svg>
      <span class="app-published-header-text">App Published!</span>
    </div>
-    <CopyInput
-      value={publishedUrl}
-      label="You can view your app at:"
-      dataCy="deployed-app-url"
-    />
+    <CopyInput value={publishedUrl} label="You can view your app at:" />
  </ModalContent>
 </Modal>

--- a/packages/builder/src/components/deploy/DeployNavigation.svelte
+++ b/packages/builder/src/components/deploy/DeployNavigation.svelte
@ -124,7 +124,6 @@
        bind:this={publishPopover}
        align="right"
        disabled={!isPublished}
-        dataCy="publish-popover-menu"
        showTip={true}
        anchor={publishPopoverAnchor}
      >
@ -148,7 +147,6 @@
              icon="GlobeStrike"
              disabled={!isPublished}
              on:click={unpublishApp}
-              dataCy="publish-popover-action"
            >
              Unpublish
            </Button>
@ -173,7 +171,6 @@
  title="Confirm unpublish"
  okText="Unpublish app"
  onOk={confirmUnpublishApp}
-  dataCy={"unpublish-modal"}
 >
  Are you sure you want to unpublish the app <b>{selectedApp?.name}</b>?
 </ConfirmDialog>
--- a/packages/builder/src/components/deploy/RevertModal.svelte
+++ b/packages/builder/src/components/deploy/RevertModal.svelte
@ -33,7 +33,6 @@
  hoverable
  on:click={revertModal.show}
  tooltip="Revert changes"
-  dataCy="revert-application-topnav"
 />
 <Modal bind:this={revertModal}>
  <ModalContent
--- a/packages/builder/src/components/design/settings/controls/DataSourceSelect.svelte
+++ b/packages/builder/src/components/design/settings/controls/DataSourceSelect.svelte
@ -193,11 +193,7 @@
    </Drawer>
  {/if}
 </div>
-<Popover
-  bind:this={dropdownRight}
-  anchor={anchorRight}
-  dataCy={`dataSource-popover-${$store.selectedComponentId}`}
->
+<Popover bind:this={dropdownRight} anchor={anchorRight}>
  <div class="dropdown">
    <div class="title">
      <Heading size="XS">Tables</Heading>
--- a/packages/builder/src/components/design/settings/controls/IconSelect/IconSelect.svelte
+++ b/packages/builder/src/components/design/settings/controls/IconSelect/IconSelect.svelte
@ -121,12 +121,7 @@
    {displayValue}
  </ActionButton>
 </div>
-<Popover
-  bind:this={dropdown}
-  on:open={setSelectedUI}
-  anchor={buttonAnchor}
-  dataCy="icon-popover"
->
+<Popover bind:this={dropdown} on:open={setSelectedUI} anchor={buttonAnchor}>
  <div class="container">
    <div class="search-area">
      <div class="alphabet-area">
--- a/packages/builder/src/components/design/settings/controls/PropertyControl.svelte
+++ b/packages/builder/src/components/design/settings/controls/PropertyControl.svelte
@ -74,17 +74,13 @@
  })
 </script>

-<div
-  class="property-control"
-  class:highlighted={highlighted && nullishValue}
-  data-cy={`setting-${key}`}
->
+<div class="property-control" class:highlighted={highlighted && nullishValue}>
  {#if type !== "boolean" && label}
    <div class="label">
      <Label>{label}</Label>
    </div>
  {/if}
-  <div data-cy={`${key}-prop-control`} class="control">
+  <div id={`${key}-prop-control`} class="control">
    <svelte:component
      this={control}
      {componentInstance}
--- a/packages/builder/src/components/portal/onboarding/TourPopover.svelte
+++ b/packages/builder/src/components/portal/onboarding/TourPopover.svelte
@ -113,7 +113,6 @@
    align={tourStep?.align}
    bind:this={popover}
    anchor={popoverAnchor}
-    dataCy="tour-popover-menu"
    maxWidth={300}
    dismissible={false}
  >
--- a/packages/builder/src/components/settings/ProfileModal.svelte
+++ b/packages/builder/src/components/settings/ProfileModal.svelte
@ -23,14 +23,6 @@
    Personalise the platform by adding your first name and last name.
  </Body>
  <Input disabled bind:value={$auth.user.email} label="Email" />
-  <Input
-    bind:value={$values.firstName}
-    label="First name"
-    dataCy="user-first-name"
-  />
-  <Input
-    bind:value={$values.lastName}
-    label="Last name"
-    dataCy="user-last-name"
-  />
+  <Input bind:value={$values.firstName} label="First name" />
+  <Input bind:value={$values.lastName} label="Last name" />
 </ModalContent>
--- a/packages/builder/src/components/start/AppRow.svelte
+++ b/packages/builder/src/components/start/AppRow.svelte
@ -30,11 +30,11 @@
 </script>

 <div class="app-row" on:click={handleDefaultClick}>
-  <div class="title" data-cy={`${app.devId}`}>
+  <div class="title">
    <div class="app-icon">
      <Icon size="L" name={app.icon?.name || "Apps"} color={app.icon?.color} />
    </div>
-    <div class="name" data-cy="app-name-link">
+    <div class="name">
      <Heading size="S">
        {app.name}
      </Heading>
@ -56,7 +56,7 @@
    <Body size="S">{app.deployed ? "Published" : "Unpublished"}</Body>
  </div>

-  <div class="app-row-actions" data-cy={`row_actions_${app.appId}`}>
+  <div class="app-row-actions">
    <AppLockModal {app} buttonSize="M" />
    <Button size="S" secondary on:click={goToOverview}>Manage</Button>
    <Button size="S" primary disabled={app.lockedOther} on:click={goToBuilder}>
--- a/packages/builder/src/pages/builder/app/[application]/data/_layout.svelte
+++ b/packages/builder/src/pages/builder/app/[application]/data/_layout.svelte
@ -11,9 +11,7 @@
 <div class="data">
  <Panel title="Sources" borderRight>
    <Layout paddingX="L" paddingY="XL" gap="S">
-      <Button dataCy={`new-datasource`} cta on:click={modal.show}>
-        Add source
-      </Button>
+      <Button cta on:click={modal.show}>Add source</Button>
      <CreateDatasourceModal bind:modal />
      <DatasourceNavigator />
    </Layout>
--- a/packages/builder/src/pages/builder/app/[application]/design/[screenId]/_components/AppPreview.svelte
+++ b/packages/builder/src/pages/builder/app/[application]/design/[screenId]/_components/AppPreview.svelte
@ -204,7 +204,7 @@
      store.actions.settings.highlight(data.setting)

      // Also scroll setting into view
-      const selector = `[data-cy="${data.setting}-prop-control"`
+      const selector = `#${data.setting}-prop-control`
      const element = document.querySelector(selector)?.parentElement
      if (element) {
        element.scrollIntoView({
--- a/packages/builder/src/pages/builder/app/[application]/design/[screenId]/components/[componentId]/new/_components/NewComponentPanel.svelte
+++ b/packages/builder/src/pages/builder/app/[application]/design/[screenId]/components/[componentId]/new/_components/NewComponentPanel.svelte
@ -256,7 +256,6 @@
                  draggable="true"
                  on:dragstart={() => onDragStart(component.component)}
                  on:dragend={onDragEnd}
-                  data-cy={`component-${component.name}`}
                  class="component"
                  class:selected={selectedIndex ===
                    orderMap[component.component]}
--- a/packages/builder/src/pages/builder/app/[application]/design/[screenId]/screens/_components/DatasourceModal.svelte
+++ b/packages/builder/src/pages/builder/app/[application]/design/[screenId]/screens/_components/DatasourceModal.svelte
@ -66,7 +66,7 @@
  })
 </script>

-<span data-cy="data-source-modal">
+<span>
  <ModalContent
    title="Autogenerated screens"
    confirmText="Confirm"
--- a/packages/builder/src/pages/builder/app/[application]/design/[screenId]/screens/_components/NewScreenModal.svelte
+++ b/packages/builder/src/pages/builder/app/[application]/design/[screenId]/screens/_components/NewScreenModal.svelte
@ -33,7 +33,7 @@
          selectedScreenMode = blankScreenModeKey
        }}
      >
-        <div data-cy="blank-screen" class="content screen-type-wrap">
+        <div class="content screen-type-wrap">
          <Icon name="WebPage" />
          <div class="screen-type-text">
            <Heading size="XS">Blank screen</Heading>
@ -60,7 +60,7 @@
        class:disabled={!$tables.list.filter(table => table._id !== "ta_users")
          .length}
      >
-        <div data-cy="autogenerated-screens" class="content screen-type-wrap">
+        <div class="content screen-type-wrap">
          <Icon name="WebPages" />
          <div class="screen-type-text">
            <Heading size="XS">Autogenerated screens</Heading>
--- a/packages/builder/src/pages/builder/apps/index.svelte
+++ b/packages/builder/src/pages/builder/apps/index.svelte
@ -94,7 +94,7 @@
        <Layout noPadding>
          <div class="header">
            <img class="logo" alt="logo" src={$organisation.logoUrl || Logo} />
-            <ActionMenu align="right" dataCy="user-menu">
+            <ActionMenu align="right">
              <div slot="control" class="avatar">
                <Avatar
                  size="M"
--- a/packages/builder/src/pages/builder/portal/_components/UserDropdown.svelte
+++ b/packages/builder/src/pages/builder/portal/_components/UserDropdown.svelte
@ -21,33 +21,25 @@
  }
 </script>

-<ActionMenu align="right" dataCy="user-menu">
+<ActionMenu align="right">
  <div slot="control" class="user-dropdown">
    <Avatar size="M" initials={$auth.initials} url={$auth.user.pictureUrl} />
    <Icon size="XL" name="ChevronDown" />
  </div>
-  <MenuItem
-    icon="UserEdit"
-    on:click={() => profileModal.show()}
-    dataCy="user-info"
-  >
+  <MenuItem icon="UserEdit" on:click={() => profileModal.show()}>
    My profile
  </MenuItem>
-  <MenuItem icon="Moon" on:click={() => themeModal.show()} dataCy="theme">
-    Theme
-  </MenuItem>
+  <MenuItem icon="Moon" on:click={() => themeModal.show()}>Theme</MenuItem>
  <MenuItem icon="LockClosed" on:click={() => updatePasswordModal.show()}>
    Update password
  </MenuItem>
-  <MenuItem icon="Key" on:click={() => apiKeyModal.show()} dataCy="api-key">
+  <MenuItem icon="Key" on:click={() => apiKeyModal.show()}>
    View API key
  </MenuItem>
  <MenuItem icon="UserDeveloper" on:click={() => $goto("../apps")}>
    Close developer mode
  </MenuItem>
-  <MenuItem dataCy="user-logout" icon="LogOut" on:click={logout}>
-    Log out
-  </MenuItem>
+  <MenuItem icon="LogOut" on:click={logout}>Log out</MenuItem>
 </ActionMenu>

 <Modal bind:this={themeModal}>
--- a/packages/builder/src/pages/builder/portal/apps/create.svelte
+++ b/packages/builder/src/pages/builder/portal/apps/create.svelte
@ -46,20 +46,10 @@
    </Breadcrumbs>
    <Header title={$apps.length ? "Create new app" : "Create your first app"}>
      <div slot="buttons">
-        <Button
-          dataCy="import-app-btn"
-          size="M"
-          secondary
-          on:click={initiateAppImport}
-        >
+        <Button size="M" secondary on:click={initiateAppImport}>
          Import app
        </Button>
-        <Button
-          dataCy="create-app-btn"
-          size="M"
-          cta
-          on:click={initiateAppCreation}
-        >
+        <Button size="M" cta on:click={initiateAppCreation}>
          Start from scratch
        </Button>
      </div>
--- a/packages/builder/src/pages/builder/portal/apps/index.svelte
+++ b/packages/builder/src/pages/builder/portal/apps/index.svelte
@ -240,12 +240,7 @@
        <Layout noPadding gap="L">
          <div class="title">
            <div class="buttons">
-              <Button
-                dataCy="create-app-btn"
-                size="M"
-                cta
-                on:click={initiateAppCreation}
-              >
+              <Button size="M" cta on:click={initiateAppCreation}>
                Create new app
              </Button>
              {#if $apps?.length > 0}
@ -258,13 +253,7 @@
                </Button>
              {/if}
              {#if !$apps?.length}
-                <Button
-                  dataCy="import-app-btn"
-                  size="L"
-                  quiet
-                  secondary
-                  on:click={initiateAppImport}
-                >
+                <Button size="L" quiet secondary on:click={initiateAppImport}>
                  Import app
                </Button>
              {/if}
--- a/packages/builder/src/pages/builder/portal/overview/[appId]/_layout.svelte
+++ b/packages/builder/src/pages/builder/portal/overview/[appId]/_layout.svelte
@ -139,7 +139,6 @@
              secondary
              disabled={!isPublished}
              on:click={viewApp}
-              dataCy="view-app"
            >
              View
            </Button>
@ -154,7 +153,7 @@
              Edit
            </Button>
          </span>
-          <ActionMenu align="right" dataCy="app-overview-menu-popover">
+          <ActionMenu align="right">
            <span slot="control" class="app-overview-actions-icon">
              <Icon hoverable name="More" />
            </span>
@ -248,11 +247,7 @@
    <br />
    Please enter the app name below to confirm.
    <br /><br />
-    <Input
-      bind:value={deletionConfirmationAppName}
-      data-cy="delete-app-confirmation"
-      placeholder={app?.name}
-    />
+    <Input bind:value={deletionConfirmationAppName} placeholder={app?.name} />
  </ConfirmDialog>
 {/key}

--- a/packages/builder/src/pages/builder/portal/overview/[appId]/overview.svelte
+++ b/packages/builder/src/pages/builder/portal/overview/[appId]/overview.svelte
@ -104,7 +104,7 @@
 <div class="overview-tab">
  <Layout noPadding gap="XL">
    <div class="top">
-      <DashCard title={"App Status"} dataCy={"app-status"}>
+      <DashCard title={"App Status"}>
        <div class="status-content">
          <div class="status-display">
            {#if isPublished}
@ -137,7 +137,7 @@
        </div>
      </DashCard>
      {#if appEditor}
-        <DashCard title={"Last Edited"} dataCy={"edited-by"}>
+        <DashCard title={"Last Edited"}>
          <div class="last-edited-content">
            <div class="updated-by">
              {#if appEditor}
@ -167,9 +167,8 @@
        action={() => {
          $goto("./version")
        }}
-        dataCy={"app-version"}
      >
-        <div class="version-content" data-cy={$store.version}>
+        <div class="version-content">
          <Heading size="XS">{$store.version}</Heading>
          {#if updateAvailable}
            <div class="version-status">
@ -195,7 +194,6 @@
          action={() => {
            $goto("./access")
          }}
-          dataCy={"access"}
        >
          {#if appUsers.length || appGroups.length}
            <Layout noPadding gap="S">
@ -246,7 +244,6 @@
          action={() => {
            $goto("../automation-history")
          }}
-          dataCy={"automation-history"}
        >
          <div class="automation-content">
            <div class="automation-metrics">
@ -272,7 +269,6 @@
          action={() => {
            $goto("../backups")
          }}
-          dataCy={"backups"}
        >
          <div class="backups-content">test</div>
        </DashCard>
@ -286,7 +282,6 @@
  title="Confirm unpublish"
  okText="Unpublish app"
  onOk={confirmUnpublishApp}
-  dataCy={"unpublish-modal"}
 >
  Are you sure you want to unpublish the app <b>{app?.name}</b>?
 </ConfirmDialog>
--- a/packages/builder/src/pages/builder/portal/settings/auth/index.svelte
+++ b/packages/builder/src/pages/builder/portal/settings/auth/index.svelte
@ -391,7 +391,6 @@
                bind:value={providers.oidc.config.configs[0][field.name]}
                readonly={field.readonly}
                placeholder={field.placeholder}
-                dataCy={field.name}
              />
            </div>
            {#if field.copyButton}
@ -432,7 +431,6 @@
      <div class="form-row">
        <Label size="L">Activated</Label>
        <Toggle
-          dataCy={"oidc-active"}
          text=""
          bind:value={providers.oidc.config.configs[0].activated}
        />
@ -448,7 +446,6 @@
          on:click={() => {
            providers.oidc.config.configs[0]["scopes"] = [...defaultScopes]
          }}
-          dataCy={"restore-oidc-default-scopes"}
        >
          Restore Defaults
        </Button>
@ -463,7 +460,6 @@
      <div class="form-row">
        <Label size="L">Auth Scopes</Label>
        <Input
-          dataCy={"new-scope-input"}
          error={scopesFields[0].error}
          placeholder={"New Scope"}
          bind:value={scopesFields[0].inputText}
@ -532,7 +528,6 @@
        disabled={oidcSaveButtonDisabled}
        cta
        on:click={() => save([providers.oidc])}
-        dataCy="oidc-save"
      >
        Save
      </Button>
--- a/packages/builder/src/pages/builder/portal/users/users/index.svelte
+++ b/packages/builder/src/pages/builder/portal/users/users/index.svelte
@ -222,12 +222,7 @@
  <Divider />
  <div class="controls">
    <ButtonGroup>
-      <Button
-        disabled={readonly}
-        dataCy="add-user"
-        on:click={createUserModal.show}
-        cta
-      >
+      <Button disabled={readonly} on:click={createUserModal.show} cta>
        Add users
      </Button>
      <Button disabled={readonly} on:click={importUsersModal.show} secondary>