New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

PeoplePicker Freezes When Typing In Search Values #117

Closed
Arknev opened this Issue Aug 28, 2018 · 4 comments

Comments

Projects
None yet
3 participants
@Arknev

Arknev commented Aug 28, 2018

Category

[ ] Enhancement

[X] Bug

[ ] Question

Version

Please specify what version of the library you are using: [@pnp/spfx-controls-react@1.7.0]

Expected / Desired Behavior / Question

Clicking in then typing a name (minimum 3 characters) in the PeoplePicker (PP) would return suggestions for selection.

Observed Behavior

When clicking in the PP field, I'm getting this message in the console (Chrome):
(5) PersonaBase property 'primaryText' was used but has been deprecated. Use 'text' instead.

When I type in the field I get the same message in the console and the UI becomes unresponsive:
(6319) PersonaBase property 'primaryText' was used but has been deprecated. Use 'text' instead.

After a minute or two the UI becomes responsive again and suggestions are rendered.

While suggestions are being loaded, these errors are shown in the console for a significant percentage of users:
GetPersonaPhoto:1 GET https://outlook.office365.com/owa/service.svc/s/GetPersonaPhoto?email=_USER@SP.COM_&UA=0&size=HR96x96 500 (Internal Server Error. See fault object for more information.)

Note: Pasting in names or email address works as expected.

Steps to Reproduce

My versions
+-- @microsoft/sp-build-web@1.4.1
+-- @microsoft/sp-core-library@1.4.1
+-- @microsoft/sp-lodash-subset@1.4.1
+-- @microsoft/sp-module-interfaces@1.4.1
+-- @microsoft/sp-office-ui-fabric-core@1.4.1
+-- @microsoft/sp-page-context@1.5.1
+-- @microsoft/sp-webpart-base@1.4.1
+-- @microsoft/sp-webpart-workbench@1.4.1
+-- @pnp/common@1.1.4
+-- @pnp/graph@1.1.4
+-- @pnp/logging@1.1.4
+-- @pnp/odata@1.1.4
+-- @pnp/sp@1.1.4
+-- @pnp/spfx-controls-react@1.7.0
+-- @types/chai@3.5.2
+-- @types/mocha@2.2.48
+-- @types/react@15.6.6
+-- @types/react-dom@15.5.6
+-- @types/webpack-env@1.13.6
+-- ajv@5.2.5
+-- gulp@3.9.1
+-- npm@6.4.0
+-- office-ui-fabric-react@5.122.1
+-- react@15.6.2
+-- react-dom@15.6.2
`-- sp-pnp-js@3.0.10

I was using version 1.6. Then I did an update in response to issue #95. When deploying the updated WebPart the issues became apparent.

The long delay and frozen display makes the field appear to be broken. Pasting in a name as short as "Mark" returns responses very quickly. Typing "Mark" will eventually work but you can't see the text as it is being typed.

This is my call to the PeoplePicker:
<PeoplePicker context={this.props.WpContext} titleText="Add New User" personSelectionLimit={1} groupName={''} showtooltip={false} isRequired={false} disabled={false} selectedItems={this._getPeoplePickerItems} />
When I view the WebPart in EDGE the tab becomes unresponsive, does not recover, and EDGE gives me the option stop a long running script.

@Arknev Arknev changed the title from PersonaBase Property 'primaryText' Deprecated to PeoplePicker Freezes When Typing In Search Values Aug 28, 2018

@AsishP

This comment has been minimized.

Contributor

AsishP commented Sep 7, 2018

@Arknev, will test it and let you know. I kind of knew that primarytext is getting deprecated. Will have to update and check if anything else breaks.

estruyf added a commit that referenced this issue Sep 7, 2018

@estruyf estruyf added the enhancement label Sep 7, 2018

@estruyf

This comment has been minimized.

Collaborator

estruyf commented Sep 7, 2018

Thanks @Arknev for reporting this. Until now, we didn't have a version dependency on Office UI Fabric. As the library properties are changed so often, I had to add a version dependency to the project. As of version 1.8.0 of this library, the project will use ^5.122.0 of office-ui-fabric-react.

Updated the primaryText property to the new text property. Can you test out the latest beta of 1.8.0 to verify if this helps you solve your issue? More information about how you can test out a latest beta can be found here: https://sharepoint.github.io/sp-dev-fx-controls-react/beta/

@estruyf estruyf added this to the 1.8.0 milestone Sep 7, 2018

@estruyf

This comment has been minimized.

Collaborator

estruyf commented Sep 12, 2018

Closing the issue as version 1.8.0 has just been released.

@estruyf estruyf closed this Sep 12, 2018

@Arknev

This comment has been minimized.

Arknev commented Sep 19, 2018

I combined two issues into one here. Although the primaryText issue was addressed, that issue was actually minor compared to the UI freezing when searching for users. In our tenant we have millions of users. It would be great if the "resolveDelay" property (IBasePickerProps) could be set when calling the PeoplePicker. I don't see a way to delay search until a minimum number of characters are entered, which would be best, but this time delay would likely meet our needs.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment