diff --git a/packages/console/src/components/Toast/index.module.scss b/packages/console/src/components/Toast/index.module.scss
index 9aae9c275..b21670064 100644
--- a/packages/console/src/components/Toast/index.module.scss
+++ b/packages/console/src/components/Toast/index.module.scss
@@ -21,6 +21,8 @@ div.toast {
.message {
flex: 1;
margin: 0 _.unit(3);
+ overflow: hidden;
+ overflow-wrap: break-word;
}
&.success {
diff --git a/packages/console/src/components/Toast/index.tsx b/packages/console/src/components/Toast/index.tsx
index 9d8981430..e01381b00 100644
--- a/packages/console/src/components/Toast/index.tsx
+++ b/packages/console/src/components/Toast/index.tsx
@@ -24,9 +24,7 @@ function Toast() {
{(toastInstance) => (
{toastInstance.icon}
-
- {resolveValue(toastInstance.message, toastInstance)}
-
+
{resolveValue(toastInstance.message, toastInstance)}
)}
diff --git a/packages/integration-tests/src/tests/ui/user-management.test.ts b/packages/integration-tests/src/tests/ui/user-management.test.ts
index 5011c128d..dbbd5e951 100644
--- a/packages/integration-tests/src/tests/ui/user-management.test.ts
+++ b/packages/integration-tests/src/tests/ui/user-management.test.ts
@@ -104,7 +104,7 @@ describe('user management', () => {
await expect(page).toClick('div[class$=main] div[class$=headline] > button');
await expect(page).toFillForm('form', { primaryEmail: 'jdoe@gmail.com' });
await expect(page).toClick('button[type=submit]');
- await expect(page).toMatchElement('div[class$=error] span[class$=message]', {
+ await expect(page).toMatchElement('div[class$=error] div[class$=message]', {
text: 'This email is associated with an existing account.',
});
await expect(page).toClick('.ReactModalPortal div[class$=header] button');
@@ -113,7 +113,7 @@ describe('user management', () => {
await expect(page).toClick('div[class$=main] div[class$=headline] > button');
await expect(page).toFillForm('form', { primaryPhone: '+1 810 555 5555' });
await expect(page).toClick('button[type=submit]');
- await expect(page).toMatchElement('div[class$=error] span[class$=message]', {
+ await expect(page).toMatchElement('div[class$=error] div[class$=message]', {
text: 'This phone number is associated with an existing account.',
});
await expect(page).toClick('.ReactModalPortal div[class$=header] button');
@@ -122,7 +122,7 @@ describe('user management', () => {
await expect(page).toClick('div[class$=main] div[class$=headline] > button');
await expect(page).toFillForm('form', { username: 'johndoe' });
await expect(page).toClick('button[type=submit]');
- await expect(page).toMatchElement('div[class$=error] span[class$=message]', {
+ await expect(page).toMatchElement('div[class$=error] div[class$=message]', {
text: 'This username is already in use.',
});
await expect(page).toClick('.ReactModalPortal div[class$=header] button');
@@ -157,7 +157,7 @@ describe('user management', () => {
});
await expect(page).toClick('form div[class$=actionBar] button:nth-of-type(2)');
const successToastHandle = await page.waitForSelector('div[class$=success]');
- await expect(successToastHandle).toMatchElement('span[class$=message]', {
+ await expect(successToastHandle).toMatchElement('div[class$=message]', {
text: 'Saved!',
});
// Top userinfo card shows the updated user full name as the title
@@ -209,7 +209,7 @@ describe('user management', () => {
await expect(page).toFillForm('form', { primaryEmail: 'jdoe@gmail.com' });
await page.screenshot({ path: 'user-conflict-email.png' });
await expect(page).toClick('form div[class$=actionBar] button:nth-of-type(2)');
- await expect(page).toMatchElement('div[class$=error] span[class$=message]', {
+ await expect(page).toMatchElement('div[class$=error] div[class$=message]', {
text: 'This email is associated with an existing account.',
});
// Discard changes
@@ -218,7 +218,7 @@ describe('user management', () => {
// Conflicted phone number
await expect(page).toFillForm('form', { primaryPhone: '+1 810 555 5555' });
await expect(page).toClick('form div[class$=actionBar] button:nth-of-type(2)');
- await expect(page).toMatchElement('div[class$=error] span[class$=message]', {
+ await expect(page).toMatchElement('div[class$=error] div[class$=message]', {
text: 'This phone number is associated with an existing account.',
});
// Discard changes
@@ -227,7 +227,7 @@ describe('user management', () => {
// Conflicted username
await expect(page).toFillForm('form', { username: 'johndoe' });
await expect(page).toClick('form div[class$=actionBar] button:nth-of-type(2)');
- await expect(page).toMatchElement('div[class$=error] span[class$=message]', {
+ await expect(page).toMatchElement('div[class$=error] div[class$=message]', {
text: 'This username is already in use.',
});
// Discard changes