diff --git a/packages/entities/entities-shared/sandbox/pages/ConfigCardItemPage.vue b/packages/entities/entities-shared/sandbox/pages/ConfigCardItemPage.vue index 6f4708ca9e..46c82f9289 100644 --- a/packages/entities/entities-shared/sandbox/pages/ConfigCardItemPage.vue +++ b/packages/entities/entities-shared/sandbox/pages/ConfigCardItemPage.vue @@ -191,6 +191,40 @@ +

Truncated Labels

+ + + + +

Slim card

+ + + +
diff --git a/packages/entities/entities-shared/src/components/entity-base-config-card/ConfigCardItem.cy.ts b/packages/entities/entities-shared/src/components/entity-base-config-card/ConfigCardItem.cy.ts index 9700b06c2f..3c43255e72 100644 --- a/packages/entities/entities-shared/src/components/entity-base-config-card/ConfigCardItem.cy.ts +++ b/packages/entities/entities-shared/src/components/entity-base-config-card/ConfigCardItem.cy.ts @@ -54,11 +54,11 @@ describe('', () => { cy.getTestId(`${item.key}-label-tooltip`).should('not.exist') cy.get('.config-card-details-row').invoke('width').then((rowWidth) => { - cy.getTestId(`${item.key}-label`).invoke('width').then((labelWidth) => { + cy.getTestId(`${item.key}-label`).invoke('outerWidth').then((labelWidth) => { expect(labelWidth).to.be.closeTo(Number(rowWidth) / 2, 1) }) - cy.getTestId(`${item.key}-plain-text`).invoke('width').then((labelWidth) => { - expect(labelWidth).to.be.closeTo(Number(rowWidth) / 2, 1) + cy.getTestId(`${item.key}-value`).invoke('outerWidth').then((valueWidth) => { + expect(valueWidth).to.be.closeTo(Number(rowWidth) / 2, 1) }) }) }) diff --git a/packages/entities/entities-shared/src/components/entity-base-config-card/ConfigCardItem.vue b/packages/entities/entities-shared/src/components/entity-base-config-card/ConfigCardItem.vue index 4454070776..c47cf42afc 100644 --- a/packages/entities/entities-shared/src/components/entity-base-config-card/ConfigCardItem.vue +++ b/packages/entities/entities-shared/src/components/entity-base-config-card/ConfigCardItem.vue @@ -9,7 +9,15 @@ name="label" > - {{ item.label }} + + + {{ item.label }} + + +