katello 4.8.4 → 4.9.0.rc1

data/webpack/scenes/ContentViews/components/NeedsPublishIcon.js

@@ -0,0 +1,45 @@
+import React from 'react';
+import { translate as __ } from 'foremanReact/common/I18n';
+import PropTypes from 'prop-types';
+import { Tooltip } from '@patternfly/react-core';
+import { ArrowCircleUpIcon } from '@patternfly/react-icons';
+import './NeedsPublishIcon.scss';
+
+const tooltipContent = (composite, determinate) => {
+  let content = '';
+  if (determinate) {
+    content = composite ? __('Updates available: Component content view versions have been updated.') :
+      __('Updates available: Repositories and/or filters have changed.');
+  } else {
+    content = __('We could not determine if publish is required for the content view. ' +
+        'Audit records may have been cleaned or not created for this version.');
+  }
+  return content;
+};
+
+const NeedsPublishIcon = ({ composite, determinate }) => (
+  <Tooltip
+    position="auto"
+    enableFlip
+    entryDelay={400}
+    content={tooltipContent(composite, determinate)}
+  >
+    <ArrowCircleUpIcon
+      id={determinate ? 'determinate-needs-publish' : 'indeterminate-needs-publish'}
+      size="sm"
+      className={determinate ? 'determinate-needs-publish' : 'indeterminate-needs-publish'}
+    />
+  </Tooltip>
+);
+
+NeedsPublishIcon.propTypes = {
+  composite: PropTypes.bool,
+  determinate: PropTypes.bool,
+};
+
+NeedsPublishIcon.defaultProps = {
+  composite: false,
+  determinate: false,
+};
+
+export default NeedsPublishIcon;

data/webpack/scenes/ContentViews/components/NeedsPublishIcon.scss

@@ -0,0 +1,9 @@
+.determinate-needs-publish {
+  color: var(--pf-global--primary-color--100);
+  margin-left: 9px;
+}
+
+.indeterminate-needs-publish {
+  color: var(--pf-global--disabled-color--200);
+  margin-left: 9px;
+}

data/webpack/scenes/ContentViews/expansions/RelatedContentViewComponentsModal.js

@@ -83,7 +83,7 @@ const RelatedContentViewsModal = ({ cvName, cvId, relatedCVCount }) => {
               </Thead>
               <Tbody>
                 {results?.map(details => (
-                  <Tr key={details.content_view.id} ouiaId={details.content_view.id}>
+                  <Tr key={`${details.content_view.id}`} ouiaId={`${details.content_view.id}`}>
                     <Td>
                       <Link to={urlBuilder(`content_views/${details.content_view.id}`, '')}>{details.content_view.name}</Link>
                     </Td>

data/webpack/scenes/Hosts/ChangeContentSource/components/ContentSourceForm.js

@@ -22,6 +22,8 @@ import EnvironmentPaths from '../../../../scenes/ContentViews/components/Environ
 import ContentViewSelect from '../../../../scenes/ContentViews/components/ContentViewSelect/ContentViewSelect';
 import ContentViewSelectOption from '../../../../scenes/ContentViews/components/ContentViewSelect/ContentViewSelectOption';
 import { selectContentViewsStatus } from '../selectors';
+import { getCVPlaceholderText, shouldDisableCVSelect } from '../../../ContentViews/components/ContentViewSelect/helpers';
+import { selectEnvironmentPaths } from '../../../ContentViews/components/EnvironmentPaths/EnvironmentPathSelectors';
 
 const ENV_PATH_OPTIONS = { key: ENVIRONMENT_PATHS_KEY };
 
@@ -52,7 +54,7 @@ const ContentSourceSelect = ({
       {contentSources.map(cs => (
         <SelectOption
           key={cs.id}
-          value={cs.id}
+          value={`${cs.id}`}
         >
           {cs.name}
         </SelectOption>
@@ -95,12 +97,15 @@ const ContentSourceForm = ({
   isLoading,
   hostsUpdated,
 }) => {
+  const pathsUrl = `/organizations/${orgId()}/environments/paths?permission_type=promotable${contentSourceId ? `&content_source_id=${contentSourceId}` : ''}`;
   useAPI( // No TableWrapper here, so we can useAPI from Foreman
     'get',
-    api.getApiUrl(`/organizations/${orgId()}/environments/paths?permission_type=promotable`),
+    api.getApiUrl(pathsUrl),
     ENV_PATH_OPTIONS,
   );
   const contentViewsStatus = useSelector(selectContentViewsStatus);
+  const environmentPathResponse = useSelector(selectEnvironmentPaths);
+  const envList = environmentPathResponse?.results?.map(path => path.environments).flat();
   const [csSelectOpen, setCSSelectOpen] = useState(false);
   const [cvSelectOpen, setCVSelectOpen] = useState(false);
 
@@ -126,6 +131,20 @@ const ContentSourceForm = ({
   const viewIsDisabled = (isLoading || contentViews.length === 0 ||
     contentSourceId === '' || environments === []);
 
+  const cvPlaceholderText = getCVPlaceholderText({
+    contentSourceId,
+    environments,
+    contentViewsStatus,
+    cvSelectOptions: contentViews,
+  });
+
+  const disableCVSelect = shouldDisableCVSelect({
+    contentSourceId,
+    environments,
+    contentViewsStatus,
+    cvSelectOptions: contentViews,
+  });
+
   return (
     <Form
       onSubmit={e => handleSubmit(e)}
@@ -137,6 +156,7 @@ const ContentSourceForm = ({
 
         <GridItem span={7}>
           <Alert
+            ouiaId="no-hosts-alert"
             variant="danger"
             className="margin-top-20"
             title={__('No hosts found')}
@@ -146,6 +166,7 @@ const ContentSourceForm = ({
         {contentViewsStatus === STATUS.RESOLVED &&
             !!environments.length && contentViews.length === 0 &&
             <Alert
+              ouiaId="no-cv-alert"
               variant="warning"
               className="margin-top-20"
               title={__('No content views available for the selected environment')}
@@ -165,6 +186,17 @@ const ContentSourceForm = ({
         isOpen={csSelectOpen}
         isDisabled={contentSourcesIsDisabled || hostsUpdated}
       />
+      {envList?.some(env => env?.content_source?.environment_is_associated === false) &&
+        <Alert
+          ouiaId="disabled-environments-alert"
+          variant="info"
+          isInline
+          title={__('Some environments are disabled because they are not associated with the selected content source.')}
+          style={{ marginBottom: '1rem' }}
+        >
+          {__('To enable them, add the environment to the content source, or select a different content source.')}
+        </Alert>
+      }
       <EnvironmentPaths
         style={{ display: 'block' }}
         userCheckedItems={environments}
@@ -174,30 +206,25 @@ const ContentSourceForm = ({
         headerText={__('Environment')}
         isDisabled={environmentIsDisabled || hostsUpdated}
       />
-      {environments.length > 0 && contentViewsStatus !== STATUS.PENDING &&
-        <ContentViewSelect
-          selections={contentViewName}
-          onClear={() => handleContentView(null)}
-          onSelect={handleCVSelect}
-          isOpen={cvSelectOpen}
-          isDisabled={viewIsDisabled || hostsUpdated}
-          onToggle={isExpanded => setCVSelectOpen(isExpanded)}
-          headerText={__('Content view')}
-          ouiaId="SelectContentView"
-          className="set-select-width"
-          placeholderText={(contentViews.length === 0) ? __('No content views available') : __('Select a content view')}
-        >
-          {contentViews?.map(cv => (<ContentViewSelectOption
-            key={cv.id}
-            cv={cv}
-            env={environments[0]}
-          />))}
-        </ContentViewSelect>
-        }
+      <ContentViewSelect
+        selections={contentViewName}
+        onClear={() => handleContentView(null)}
+        onSelect={handleCVSelect}
+        isOpen={cvSelectOpen}
+        isDisabled={viewIsDisabled || hostsUpdated || disableCVSelect}
+        onToggle={isExpanded => setCVSelectOpen(isExpanded)}
+        headerText={__('Content view')}
+        ouiaId="SelectContentView"
+        className="set-select-width"
+        placeholderText={cvPlaceholderText}
+      >
+        {!environmentIsDisabled && contentViews?.map(cv => <ContentViewSelectOption key={`${cv.id}`} value={`${cv.name}`} cv={cv} env={environments[0]} />)}
+      </ContentViewSelect>
       <ActionGroup style={{ display: 'block' }}>
         <Button
           variant="primary"
           id="generate_btn"
+          ouiaId="update-source-button"
           onClick={e => handleSubmit(e)}
           isDisabled={isLoading || !formIsValid() || hostsUpdated}
           isLoading={isLoading}

data/webpack/scenes/Hosts/ChangeContentSource/components/ContentSourceTemplate.js

@@ -41,7 +41,13 @@ const ContentSourceTemplate = ({ template, jobInvocationPath }) => {
   return (
     <Grid>
       <GridItem span={7}>
-        <Alert variant="warning" title={__('Host configurations are not updated yet')} className="margin-top-20" isInline>
+        <Alert
+          ouiaId="host-configuration-alert"
+          variant="warning"
+          title={__('Host configurations are not updated yet')}
+          className="margin-top-20"
+          isInline
+        >
           <FormattedMessage
             id="ccs_alert"
             values={{

data/webpack/scenes/Hosts/ChangeContentSource/components/FormField.js

@@ -14,6 +14,7 @@ const FormField = ({
   <GridItem span={7}>
     <FormGroup label={label} fieldId={id} isRequired>
       <FormSelect
+        ouiaId={`${id}_select`}
         value={value}
         onChange={v => onChange(v)}
         className="without_select2"

data/webpack/scenes/Hosts/ChangeContentSource/components/HostsModal.js

@@ -19,6 +19,7 @@ const HostsModal = ({
 
   return (
     <Modal
+      ouiaId="hosts-modal-modal"
       variant={ModalVariant.small}
       title={modalTitle}
       position="top"
@@ -35,6 +36,7 @@ const HostsModal = ({
         {(search ? hosts.filter(h => (`${h.name}`).includes(search)) : hosts).map(h => (
           <ListItem key={h.id}>
             <Button
+              ouiaId={`hosts-modal-button-${h.id}`}
               component="a"
               href={foremanUrl(`/new/hosts/${h.name}`)}
               variant="link"

data/webpack/scenes/Hosts/ChangeContentSource/index.js

@@ -122,6 +122,7 @@ const ChangeContentSourcePage = () => {
         <Grid className="margin-left-20">
           <GridItem span={7}>
             <Title
+              ouiaId="change-cs-title"
               headingLevel="h5"
               size="2xl"
             >
@@ -131,6 +132,7 @@ const ChangeContentSourcePage = () => {
           {noHostSpecified &&
             <GridItem span={7}>
               <Alert
+                ouiaId="no-host-alert"
                 variant="danger"
                 className="margin-top-20"
                 title={__('No hosts were specified')}

data/webpack/scenes/ModuleStreams/Details/__tests__/__snapshots__/ModuleStreamDetailInfo.test.js.snap

@@ -6,6 +6,7 @@ exports[`Module stream detail info component rendering renders with module strea
   bsClass="table"
   condensed={false}
   hover={false}
+  ouiaId="content-details-info-table"
   responsive={false}
   striped={false}
 >

data/webpack/scenes/ModuleStreams/__tests__/__snapshots__/ModuleStreamsTable.test.js.snap

@@ -88,6 +88,7 @@ exports[`Module streams table should render and contain appropiate components 1`
     }
     itemCount={0}
     onPaginationChange={[Function]}
+    ouiaId="content-table-table"
     pagination={Object {}}
     rows={Array []}
   />

data/webpack/scenes/RedHatRepositories/RedHatRepositoriesPage.js

@@ -49,6 +49,7 @@ class RedHatRepositoriesPage extends Component {
           <Row className="toolbar-pf">
             <Col>
               <Alert
+                ouiaId="repo-sets-alert"
                 variant="info"
                 className="repo-sets-alert"
                 isInline
@@ -96,6 +97,7 @@ class RedHatRepositoriesPage extends Component {
             <h2>
               {__('Enabled Repositories')}
               <Button
+                ouiaId="export-csv-button"
                 className="pull-right"
                 onClick={() => { api.open('/repositories.csv', repoParams); }}
               >

data/webpack/scenes/RedHatRepositories/__tests__/__snapshots__/RedHatRepositoriesPage.test.js.snap

@@ -97,6 +97,7 @@ exports[`RedHatRepositories page should render 1`] = `
           className="pull-right"
           disabled={false}
           onClick={[Function]}
+          ouiaId="export-csv-button"
         >
           Export as CSV
         </Button>
@@ -120,6 +121,7 @@ exports[`RedHatRepositories page should render 1`] = `
               onChange={[Function]}
               onPerPageSelect={null}
               onSetPage={null}
+              ouiaId="enabled-repos-pagination"
               page={1}
               perPage={null}
               updateParamsByUrl={true}

data/webpack/scenes/RedHatRepositories/components/RecommendedRepositorySetsToggler.js

@@ -18,7 +18,12 @@ const RecommendedRepositorySetsToggler = ({
 
   return (
     <div className={classes} {...props}>
-      <Switch bsSize="mini" value={enabled} onChange={() => onChange(!enabled)} />
+      <Switch
+        ouiaId="enabled-repo-set-switch"
+        bsSize="mini"
+        value={enabled}
+        onChange={() => onChange(!enabled)}
+      />
       <Icon type="fa" name="star" />
       {children}
       <FieldLevelHelp content={help} />

data/webpack/scenes/RedHatRepositories/components/RepositorySetRepositories.js

@@ -53,7 +53,7 @@ export class RepositorySetRepositories extends Component {
 
     if (data.error) {
       return (
-        <Alert type="danger">
+        <Alert type="danger" ouiaId="repo-set-alert">
           <span>{data.error.displayMessage}</span>
         </Alert>
       );

data/webpack/scenes/RedHatRepositories/components/__tests__/__snapshots__/RecommendedRepositorySetsToggler.test.js.snap

@@ -19,6 +19,7 @@ exports[`RecommendedRepositorySetsToggler rendering renders recommended-reposito
     onChange={[Function]}
     onColor="primary"
     onText="ON"
+    ouiaId="enabled-repo-set-switch"
     readonly={false}
     tristate={false}
     value={true}

data/webpack/scenes/RedHatRepositories/components/__tests__/__snapshots__/RepositorySetRepositories.test.js.snap

@@ -18,6 +18,7 @@ exports[`RepositorySetRepositories Component should render with error 1`] = `
 <Alert
   className=""
   onDismiss={null}
+  ouiaId="repo-set-alert"
   type="danger"
 >
   <span>

data/webpack/scenes/RedHatRepositories/helpers.js

@@ -34,6 +34,7 @@ export const getSetsComponent = (repoSetsState, onPaginationChange) => {
     <ListView>
       <div className="sticky-pagination">
         <Pagination
+          ouiaId="repos-pagination"
           itemCount={itemCount}
           onChange={onPaginationChange}
           isCompact
@@ -64,6 +65,7 @@ export const getEnabledComponent = (enabledReposState, onPaginationChange) => {
     <ListView>
       <div className="sticky-pagination sticky-pagination-grey">
         <Pagination
+          ouiaId="enabled-repos-pagination"
           isCompact
           itemCount={itemCount}
           onChange={onPaginationChange}

data/webpack/scenes/Subscriptions/Details/SubscriptionDetailAssociations.js

@@ -10,7 +10,7 @@ const SubscriptionDetailAssociations = ({ subscriptionDetails }) => {
   return (
     <div>
       <h2>{__('Associations')}</h2>
-      <Table striped bordered condensed hover>
+      <Table ouiaId="associations-table" striped bordered condensed hover>
         <thead>
           <tr>
             <td><b>{__('Resource')}</b></td>

data/webpack/scenes/Subscriptions/Details/SubscriptionDetailInfo.js

@@ -37,7 +37,7 @@ const SubscriptionDetailInfo = ({ subscriptionDetails }) => {
   return (
     <div>
       <h2>{__('Subscription Info')}</h2>
-      <Table>
+      <Table ouiaId="subscription-info-table">
         <tbody>
           {Object.keys(subscriptionAttributes).map(key => (
             <tr key={key}>
@@ -56,7 +56,7 @@ const SubscriptionDetailInfo = ({ subscriptionDetails }) => {
         </tbody>
       </Table>
       <h2>{__('System Purpose')}</h2>
-      <Table>
+      <Table ouiaId="system-purpose-table">
         <tbody>
           {Object.keys(subscriptionPurposeAttributes).map(key => (
             <tr key={key}>

data/webpack/scenes/Subscriptions/Details/SubscriptionDetails.js

@@ -81,16 +81,16 @@ class SubscriptionDetails extends Component {
         <TabContainer id="subscription-tabs-container" defaultActiveKey={1}>
           <div>
             <LoadingState loading={subscriptionDetails.loading} loadingText={__('Loading')}>
-              <Nav bsClass="nav nav-tabs">
-                <NavItem eventKey={1}>
+              <Nav bsClass="nav nav-tabs" ouiaId="subscription-details-nav">
+                <NavItem eventKey={1} ouiaId="details-nav-item">
                   <div>{__('Details')}</div>
                 </NavItem>
-                <NavItem eventKey={2}>
+                <NavItem eventKey={2} ouiaId="product-content-nav-item">
                   <div>{__('Product Content')}</div>
                 </NavItem>
               </Nav>
               <Grid bsClass="container-fluid">
-                <TabContent animation={false}>
+                <TabContent ouiaId="subscription-details-tab-content" animation={false}>
                   <TabPane eventKey={1}>
                     <div>
                       <Row>

data/webpack/scenes/Subscriptions/Details/__tests__/__snapshots__/SubscriptionDetailAssociations.test.js.snap

@@ -7,6 +7,7 @@ exports[`subscriptions detail associations page renders correctly 1`] = `
   </h2>
   <table
     className="table table-striped table-bordered table-condensed table-hover"
+    ouiaId="associations-table"
   >
     <thead>
       <tr>

data/webpack/scenes/Subscriptions/Details/__tests__/__snapshots__/SubscriptionDetailInfo.test.js.snap

@@ -7,6 +7,7 @@ exports[`subscriptions detail associations page renders correctly 1`] = `
   </h2>
   <table
     className="table"
+    ouiaId="subscription-info-table"
   >
     <tbody>
       <tr>
@@ -176,6 +177,7 @@ exports[`subscriptions detail associations page renders correctly 1`] = `
   </h2>
   <table
     className="table"
+    ouiaId="system-purpose-table"
   >
     <tbody>
       <tr>

data/webpack/scenes/Subscriptions/Details/__tests__/__snapshots__/SubscriptionDetails.test.js.snap

@@ -37,6 +37,7 @@ exports[`subscriptions details page should render and contain appropiate compone
         <Nav
           bsClass="nav nav-tabs"
           justified={false}
+          ouiaId="subscription-details-nav"
           pullLeft={false}
           pullRight={false}
           stacked={false}
@@ -45,6 +46,7 @@ exports[`subscriptions details page should render and contain appropiate compone
             active={false}
             disabled={false}
             eventKey={1}
+            ouiaId="details-nav-item"
           >
             <div>
               Details
@@ -54,6 +56,7 @@ exports[`subscriptions details page should render and contain appropiate compone
             active={false}
             disabled={false}
             eventKey={2}
+            ouiaId="product-content-nav-item"
           >
             <div>
               Product Content
@@ -70,6 +73,7 @@ exports[`subscriptions details page should render and contain appropiate compone
             bsClass="tab"
             componentClass="div"
             mountOnEnter={false}
+            ouiaId="subscription-details-tab-content"
             unmountOnExit={false}
           >
             <TabPane

data/webpack/scenes/Subscriptions/Manifest/CdnConfigurationTab/NetworkSyncForm.js

@@ -117,6 +117,7 @@ const NetworkSyncForm = ({
         { !validated && (
           <FormAlert>
             <Alert
+              ouiaId="cdn-configuration-form-alert"
               variant="danger"
               title={__('Username, Password, Organization Label, and SSL CA Content Credential must be provided together.')}
               aria-live="polite"
@@ -126,7 +127,7 @@ const NetworkSyncForm = ({
         )}
 
         <div id="update-hint-upstream-server" className="margin-top-16">
-          <Text>
+          <Text ouiaId="upstream-server-text">
             <FormattedMessage
               id="cdn-configuration-type"
               defaultMessage={__('Red Hat content will be consumed from an {type}.')}

data/webpack/scenes/Subscriptions/Manifest/ManageManifestModal.js

@@ -128,7 +128,7 @@ class ManageManifestModal extends Component {
 
     return (
       <ForemanModal id={MANAGE_MANIFEST_MODAL_ID} title={__('Manage Manifest')}>
-        <Tabs id="manifest-history-tabs">
+        <Tabs id="manifest-history-tabs" ouiaId="manifest-history-tabs">
           {showManifestTab &&
             <Tab eventKey={1} title={__('Manifest')}>
                 {showSubscriptionManifest &&
@@ -194,10 +194,10 @@ class ManageManifestModal extends Component {
                           <ForemanModal title={__('Confirm delete manifest')} id={DELETE_MANIFEST_MODAL_ID}>
                             <DeleteManifestModalText />
                             <ForemanModal.Footer>
-                              <Button bsStyle="default" onClick={this.hideDeleteManifestModal}>
+                              <Button ouiaId="cancel-button" bsStyle="default" onClick={this.hideDeleteManifestModal}>
                                 {__('Cancel')}
                               </Button>
-                              <Button bsStyle="danger" onClick={this.deleteManifest}>
+                              <Button ouiaId="delete-button" bsStyle="danger" onClick={this.deleteManifest}>
                                 {__('Delete')}
                               </Button>
                             </ForemanModal.Footer>
@@ -213,6 +213,7 @@ class ManageManifestModal extends Component {
           <Tab eventKey={2} title={__('Manifest History')}>
             <LoadingState loading={manifestHistory.loading} loadingText={__('Loading')}>
               <Table
+                ouiaId="manifest-history-table"
                 rows={manifestHistory.results}
                 columns={columns}
                 emptyState={emptyStateData()}
@@ -234,7 +235,7 @@ class ManageManifestModal extends Component {
           }
         </Tabs>
         <ForemanModal.Footer>
-          <Button bsStyle="primary" onClick={this.hideModal}>
+          <Button ouiaId="close-button" bsStyle="primary" onClick={this.hideModal}>
             {__('Close')}
           </Button>
         </ForemanModal.Footer>

data/webpack/scenes/Subscriptions/Manifest/SimpleContentAccess.js

@@ -65,6 +65,7 @@ const SimpleContentAccess = (props) => {
         <div id="manifest-toggle-sca-switch">
           <Switch
             id="simple-switch"
+            ouiaId="simple-switch"
             isChecked={isSimpleContentAccessEnabled}
             onChange={toggleSimpleContentAccess}
             isDisabled={!canToggleSimpleContentAccess}

data/webpack/scenes/Subscriptions/SubscriptionsPage.js

@@ -220,7 +220,7 @@ class SubscriptionsPage extends Component {
       };
 
     const SCAAlert = (
-      <Alert type={simpleContentAccess ? 'info' : 'warning'}>
+      <Alert ouiaId="sca-alert" type={simpleContentAccess ? 'info' : 'warning'}>
         <FormattedMessage
           id="sca-alert"
           values={{

data/webpack/scenes/Subscriptions/UpstreamSubscriptions/UpstreamSubscriptionsPage.js

@@ -132,6 +132,7 @@ class UpstreamSubscriptionsPage extends Component {
           <Row>
             <Col sm={12}>
               <Button
+                ouiaId="submit-button"
                 style={{ marginTop: '10px', marginRight: '5px' }}
                 bsStyle="primary"
                 type="submit"
@@ -143,7 +144,7 @@ class UpstreamSubscriptionsPage extends Component {
               </Button>
 
               <LinkContainer to="/subscriptions" style={{ marginTop: '10px' }}>
-                <Button>
+                <Button ouiaId="cancel-button">
                   {__('Cancel')}
                 </Button>
               </LinkContainer>
@@ -240,6 +241,7 @@ class UpstreamSubscriptionsPage extends Component {
           <Row>
             <Col sm={12}>
               <Table
+                ouiaId="upstream-subscriptions-table"
                 rows={rows}
                 columns={tableColumns}
                 emptyState={emptyStateData()}

data/webpack/scenes/Subscriptions/UpstreamSubscriptions/__tests__/__snapshots__/UpstreamSubscriptionsPage.test.js.snap

@@ -137,6 +137,7 @@ exports[`upstream subscriptions page should render 1`] = `
           }
           itemCount={2}
           onPaginationChange={[Function]}
+          ouiaId="upstream-subscriptions-table"
           pagination={
             Object {
               "page": 1,
@@ -190,6 +191,7 @@ exports[`upstream subscriptions page should render 1`] = `
           bsStyle="primary"
           disabled={true}
           onClick={[Function]}
+          ouiaId="submit-button"
           style={
             Object {
               "marginRight": "5px",
@@ -214,6 +216,7 @@ exports[`upstream subscriptions page should render 1`] = `
             bsClass="btn"
             bsStyle="default"
             disabled={false}
+            ouiaId="cancel-button"
           >
             Cancel
           </Button>

data/webpack/scenes/Subscriptions/__tests__/__snapshots__/SubscriptionsPage.test.js.snap

@@ -74,6 +74,7 @@ exports[`subscriptions page should render 1`] = `
         <Alert
           className=""
           onDismiss={null}
+          ouiaId="sca-alert"
           type="warning"
         >
           <FormattedMessage

data/webpack/scenes/Subscriptions/components/SubscriptionsTable/SubscriptionsTable.js

@@ -270,7 +270,7 @@ class SubscriptionsTable extends Component {
   render() {
     return (
       <LoadingState {...this.getLoadingStateProps()}>
-        <Table {...this.getTableProps()} />
+        <Table ouiaId="subscriptions-table" {...this.getTableProps()} />
         <Dialogs {...this.getDialogsProps()} />
       </LoadingState>
     );