diff --git a/packages/patternfly-4/react-core/src/components/Alert/Alert.tsx b/packages/patternfly-4/react-core/src/components/Alert/Alert.tsx index 1cfdc43514b..eaba69bc4e6 100644 --- a/packages/patternfly-4/react-core/src/components/Alert/Alert.tsx +++ b/packages/patternfly-4/react-core/src/components/Alert/Alert.tsx @@ -71,6 +71,7 @@ const Alert: React.FunctionComponent = ({ aria-label={ariaLabel} {...(ouiaContext.isOuia && { 'data-ouia-component-type': 'Alert', + 'data-ouia-component-ns': 'PF4', 'data-ouia-component-id': ouiaId || ouiaContext.ouiaId })} {...(isLiveRegion && { diff --git a/packages/patternfly-4/react-core/src/components/Breadcrumb/Breadcrumb.tsx b/packages/patternfly-4/react-core/src/components/Breadcrumb/Breadcrumb.tsx index b95fe747ac9..65e5ab05b6a 100644 --- a/packages/patternfly-4/react-core/src/components/Breadcrumb/Breadcrumb.tsx +++ b/packages/patternfly-4/react-core/src/components/Breadcrumb/Breadcrumb.tsx @@ -26,6 +26,7 @@ const Breadcrumb: React.FunctionComponent = className={css(styles.breadcrumb, className)} {...(ouiaContext.isOuia && { 'data-ouia-component-type': 'Breadcrumb', + 'data-ouia-component-ns': 'PF4', 'data-ouia-component-id': ouiaId || ouiaContext.ouiaId })} > diff --git a/packages/patternfly-4/react-core/src/components/Button/Button.tsx b/packages/patternfly-4/react-core/src/components/Button/Button.tsx index 675c8a089eb..ac955ee5a81 100644 --- a/packages/patternfly-4/react-core/src/components/Button/Button.tsx +++ b/packages/patternfly-4/react-core/src/components/Button/Button.tsx @@ -92,6 +92,7 @@ const Button: React.FunctionComponent = ({ type={isButtonElement ? type : null} {...(ouiaContext.isOuia && { 'data-ouia-component-type': 'Button', + 'data-ouia-component-ns': 'PF4', 'data-ouia-component-id': ouiaId || ouiaContext.ouiaId })} > diff --git a/packages/patternfly-4/react-core/src/components/ChipGroup/Chip.tsx b/packages/patternfly-4/react-core/src/components/ChipGroup/Chip.tsx index a212a83134b..ab7f7a92492 100644 --- a/packages/patternfly-4/react-core/src/components/ChipGroup/Chip.tsx +++ b/packages/patternfly-4/react-core/src/components/ChipGroup/Chip.tsx @@ -64,6 +64,7 @@ class Chip extends React.Component { className={css(styles.chip, styles.modifiers.overflow, className)} {...ouiaContext.isOuia && { 'data-ouia-component-type': 'OverflowChip', + 'data-ouia-component-ns': 'PF4', 'data-ouia-component-id': ouiaId || ouiaContext.ouiaId }} > @@ -93,6 +94,7 @@ class Chip extends React.Component { className={css(styles.chip, isReadOnly && styles.modifiers.readOnly, className)} {...ouiaContext.isOuia && { 'data-ouia-component-type': 'Chip', + 'data-ouia-component-ns': 'PF4', 'data-ouia-component-id': ouiaId || ouiaContext.ouiaId }} > @@ -118,6 +120,7 @@ class Chip extends React.Component { className={css(styles.chip, isReadOnly && styles.modifiers.readOnly, className)} {...ouiaContext.isOuia && { 'data-ouia-component-type': 'Chip', + 'data-ouia-component-ns': 'PF4', 'data-ouia-component-id': ouiaId || ouiaContext.ouiaId }} > diff --git a/packages/patternfly-4/react-core/src/components/Dropdown/DropdownWithContext.tsx b/packages/patternfly-4/react-core/src/components/Dropdown/DropdownWithContext.tsx index 44241d38492..3512d2a7eaf 100644 --- a/packages/patternfly-4/react-core/src/components/Dropdown/DropdownWithContext.tsx +++ b/packages/patternfly-4/react-core/src/components/Dropdown/DropdownWithContext.tsx @@ -94,6 +94,7 @@ class DropdownWithContext extends React.Component diff --git a/packages/patternfly-4/react-core/src/components/Nav/Nav.tsx b/packages/patternfly-4/react-core/src/components/Nav/Nav.tsx index c1121d60f3f..a4e3f1d2ad7 100644 --- a/packages/patternfly-4/react-core/src/components/Nav/Nav.tsx +++ b/packages/patternfly-4/react-core/src/components/Nav/Nav.tsx @@ -143,6 +143,7 @@ class Nav extends React.Component { } {...(ouiaContext.isOuia && { 'data-ouia-component-type': 'Nav', + 'data-ouia-component-ns': 'PF4', 'data-ouia-component-id': ouiaId || ouiaContext.ouiaId })} {...props} diff --git a/packages/patternfly-4/react-core/src/components/Pagination/Pagination.tsx b/packages/patternfly-4/react-core/src/components/Pagination/Pagination.tsx index cc1fbf95e39..150877d8613 100644 --- a/packages/patternfly-4/react-core/src/components/Pagination/Pagination.tsx +++ b/packages/patternfly-4/react-core/src/components/Pagination/Pagination.tsx @@ -193,6 +193,7 @@ const Pagination: React.FunctionComponent = id={widgetId} {...(ouiaContext.isOuia && { 'data-ouia-component-type': 'Pagination', + 'data-ouia-component-ns': 'PF4', 'data-ouia-component-id': ouiaId || ouiaContext.ouiaId })} {...props} diff --git a/packages/patternfly-4/react-core/src/components/Select/Select.tsx b/packages/patternfly-4/react-core/src/components/Select/Select.tsx index 4e62ad0a6bf..4d8014b8964 100644 --- a/packages/patternfly-4/react-core/src/components/Select/Select.tsx +++ b/packages/patternfly-4/react-core/src/components/Select/Select.tsx @@ -395,6 +395,7 @@ class Select extends React.Component diff --git a/packages/patternfly-4/react-core/src/components/Switch/Switch.tsx b/packages/patternfly-4/react-core/src/components/Switch/Switch.tsx index 9e4c202df68..250cec48203 100644 --- a/packages/patternfly-4/react-core/src/components/Switch/Switch.tsx +++ b/packages/patternfly-4/react-core/src/components/Switch/Switch.tsx @@ -58,6 +58,7 @@ class Switch extends React.Component { htmlFor={this.id} {...(ouiaContext.isOuia && { 'data-ouia-component-type': 'Switch', + 'data-ouia-component-ns': 'PF4', 'data-ouia-component-id': ouiaId || ouiaContext.ouiaId })} > diff --git a/packages/patternfly-4/react-core/src/components/Tabs/Tabs.tsx b/packages/patternfly-4/react-core/src/components/Tabs/Tabs.tsx index 6de5309e6e3..6537e5279d6 100644 --- a/packages/patternfly-4/react-core/src/components/Tabs/Tabs.tsx +++ b/packages/patternfly-4/react-core/src/components/Tabs/Tabs.tsx @@ -231,6 +231,7 @@ class Tabs extends React.Component { )} {...(ouiaContext.isOuia && { 'data-ouia-component-type': 'Tabs', + 'data-ouia-component-ns': 'PF4', 'data-ouia-component-id': ouiaId || ouiaContext.ouiaId })} id={id && id} diff --git a/packages/patternfly-4/react-core/src/components/withOuia/examples/withOuia.md b/packages/patternfly-4/react-core/src/components/withOuia/examples/withOuia.md index adbd741a09d..5421e4105a8 100644 --- a/packages/patternfly-4/react-core/src/components/withOuia/examples/withOuia.md +++ b/packages/patternfly-4/react-core/src/components/withOuia/examples/withOuia.md @@ -19,7 +19,8 @@ const { ouiaContext, ouiaId } = this.props; className="" htmlFor="" {...ouiaContext.isOuia && { - 'data-ouia-component-type': 'Switch', + 'data-ouia-component-type': 'Switch', + 'data-ouia-component-ns': 'PF4', 'data-ouia-component-id': ouiaId || ouiaContext.ouiaId }} >my label @@ -36,20 +37,20 @@ const { ouiaContext, ouiaId } = this.props; ``` ``` -> render's ouia attribute **data-ouia-component-type="Switch"** +> render's ouia attribute **data-ouia-component-type="Switch" data-ouia-component-ns="PF4"** #### Case 3: enable ouia through local storage and generate id ##### in local storage _ouia: true_ ##### in local storage _ouia-generate-id: true_ ``` ``` -> render's ouia attributes **data-ouia-component-type="Switch" data-ouia-component-id="0"** +> render's ouia attributes **data-ouia-component-type="Switch" data-ouia-component-ns="PF4" data-ouia-component-id="0"** #### Case 4: enable ouia through local storage and provide id ##### in local storage _ouia: true_ ``` ``` -> render's ouia attributes **data-ouia-component-type="Switch" data-ouia-component-id="my_switch_id"** +> render's ouia attributes **data-ouia-component-type="Switch" data-ouia-component-ns="PF4" data-ouia-component-id="my_switch_id"** #### Case 5: enable ouia through context and provide id ##### Note: If context provided _isOuia_ is true and local storage provided _isOuia_ is false, context will win out. Context will also win if its _isOuia_ is false and local storage's is true. Context > local storage ``` @@ -58,4 +59,4 @@ import { OuiaContext } from '@patternfly/react-core'; ``` -> render's ouia attributes **data-ouia-component-type="Switch" data-ouia-component-id="my_switch_id"** +> render's ouia attributes **data-ouia-component-type="Switch" data-ouia-component-ns="PF4" data-ouia-component-id="my_switch_id"** diff --git a/packages/patternfly-4/react-integration/cypress/integration/ouia.spec.ts b/packages/patternfly-4/react-integration/cypress/integration/ouia.spec.ts index d51483602aa..fce0d67f20c 100644 --- a/packages/patternfly-4/react-integration/cypress/integration/ouia.spec.ts +++ b/packages/patternfly-4/react-integration/cypress/integration/ouia.spec.ts @@ -12,8 +12,10 @@ describe('Switch Demo Test', () => { it('Verify OUIA attributes exist', () => { cy.get('.pf-c-switch[for="simple-switch"]').should('have.attr', 'data-ouia-component-type', 'Switch'); + cy.get('.pf-c-switch[for="simple-switch"]').should('have.attr', 'data-ouia-component-ns', 'PF4'); cy.get('.pf-c-switch[for="simple-switch"]').should('have.attr', 'data-ouia-component-id', 'first_switch'); cy.get('.pf-c-switch[for="disabled-switch-off"]').should('have.attr', 'data-ouia-component-type', 'Switch'); + cy.get('.pf-c-switch[for="disabled-switch-off"]').should('have.attr', 'data-ouia-component-ns', 'PF4'); cy.get('.pf-c-switch[for="disabled-switch-off"]').should('not.have.attr', 'data-ouia-component-id'); }); }); diff --git a/packages/patternfly-4/react-table/src/components/Table/RowWrapper.tsx b/packages/patternfly-4/react-table/src/components/Table/RowWrapper.tsx index f47ef258b85..9c1ef9d2609 100644 --- a/packages/patternfly-4/react-table/src/components/Table/RowWrapper.tsx +++ b/packages/patternfly-4/react-table/src/components/Table/RowWrapper.tsx @@ -106,6 +106,7 @@ class RowWrapper extends React.Component