diff --git a/packages/mgt-components/src/components/mgt-person/mgt-person.tests.ts b/packages/mgt-components/src/components/mgt-person/mgt-person.tests.ts
index e5e5924d0c..dbd2464dc5 100644
--- a/packages/mgt-components/src/components/mgt-person/mgt-person.tests.ts
+++ b/packages/mgt-components/src/components/mgt-person/mgt-person.tests.ts
@@ -5,7 +5,7 @@
* -------------------------------------------------------------------------------------------
*/
import { fixture, html, expect, oneEvent } from '@open-wc/testing';
-import { MockProvider, Providers } from '@microsoft/mgt-element';
+import { LocalizationHelper, MockProvider, Providers } from '@microsoft/mgt-element';
import { registerMgtPersonComponent } from './mgt-person';
describe('mgt-person - tests', () => {
@@ -171,3 +171,66 @@ describe('mgt-person - tests', () => {
await expect(person.shadowRoot.querySelector('span.initials')).lightDom.to.equal('FV');
});
});
+
+describe('mgt-person - localization', () => {
+ registerMgtPersonComponent();
+ Providers.globalProvider = new MockProvider(true);
+
+ afterEach(() => {
+ LocalizationHelper.strings = {
+ _components: {}
+ };
+ });
+ it('should render with updated photo for text', async () => {
+ LocalizationHelper.strings = {
+ _components: {
+ person: {
+ photoFor: 'test value'
+ }
+ }
+ };
+ const person = await fixture(html``);
+ await oneEvent(person, 'person-image-rendered');
+ await expect(person).shadowDom.to.equal(
+ `
+
+
+
+
+
Megan Bowen
+
Auditor
+
+
`,
+ { ignoreAttributes: ['src'] }
+ );
+ });
+ it('should render with updated email address text', async () => {
+ LocalizationHelper.strings = {
+ _components: {
+ person: {
+ emailAddress: 'test value'
+ }
+ }
+ };
+ const person = await fixture(
+ html``
+ );
+ // await oneEvent(person, 'person-icon-rendered');
+ await expect(person).shadowDom.to.equal(
+ ``,
+ { ignoreAttributes: ['src'] }
+ );
+ });
+});
diff --git a/packages/mgt-components/src/components/mgt-person/mgt-person.ts b/packages/mgt-components/src/components/mgt-person/mgt-person.ts
index a8b6546146..b9398f9151 100644
--- a/packages/mgt-components/src/components/mgt-person/mgt-person.ts
+++ b/packages/mgt-components/src/components/mgt-person/mgt-person.ts
@@ -656,7 +656,9 @@ export class MgtPerson extends MgtTemplatedTaskComponent {
const hasImage = imageSrc && !this._isInvalidImageSrc && this.avatarType === 'photo';
const imageOnly = this.avatarType === 'photo' && this.view === 'image';
const titleText =
- (personDetailsInternal?.displayName || getEmailFromGraphEntity(personDetailsInternal)) ?? undefined;
+ (personDetailsInternal?.displayName ||
+ `${this.strings.emailAddress} ${getEmailFromGraphEntity(personDetailsInternal)}`) ??
+ undefined;
const imageTemplate = html`;
type LocalizationStorage = {
_components: LocalizationRecord;
-} & Record;
+} & Record;
/**
* Helper class for Localization