PeoplePicker Suggested People not loading after first selection

[mwahlia]

Thank you for reporting an issue, suggesting an enhancement, or asking a question. We appreciate your feedback - to help the team understand your
needs please complete the below template to ensure we have the details to help. Thanks!

Please check out the documentation to see if your question is already addressed there. This will help us ensure our documentation is up to date.

Category

[ ] Enhancement

[x] Bug

[ ] Question

Version

Please specify what version of the library you are using: [1.8.0]

My package.json:

"dependencies": {
"@microsoft/sp-core-library": "~1.4.1",
"@microsoft/sp-lodash-subset": "~1.4.1",
"@microsoft/sp-office-ui-fabric-core": "~1.4.1",
"@microsoft/sp-webpart-base": "~1.4.1",
"@pnp/common": "^1.0.4",
"@pnp/logging": "^1.0.4",
"@pnp/odata": "^1.0.4",
"@pnp/sp": "^1.0.4",
"@pnp/spfx-controls-react": "1.8.0",
"@types/es6-collections": "^0.5.31",
"@types/react": "15.6.6",
"@types/react-dnd": "~2.0.36",
"@types/react-dom": "15.5.6",
"@types/webpack-env": ">=1.12.1 <1.14.0",
"immutable": "^3.8.2",
"moment": "~2.22.1",
"react": "15.6.2",
"react-dnd": "~2.6.0",
"react-dnd-html5-backend": "~2.6.0",
"react-dom": "15.6.2",
"react-redux": "^5.0.7",
"redux-logger": "^3.0.6",
"redux-thunk": "^2.2.0",
"reselect": "^3.0.1"
}

Expected / Desired Behavior / Question

The PeoplePicker should show a new list of suggested people after a selection was made.

Observed Behavior

Configured the PeoplePicker to allow 5 selections. The first selection works fine, a list of suggested people are shown and I am able to select. However, after this first selection, the suggested people list won´t reload and I need to enter the user email addresses manually. I imagine this is not the intended behaviour?

Steps to Reproduce

Place the marker in the PeoplePicker
A list of suggested people are shown
Select one user
Now the suggested people list is empty

[AsishP]

The control seems to be working as expected for version 1.7.0, haven't tested for 1.8.0.
The behaviour is little mis-leading because you have to click outside the control and then click inside the control to get the suggested people box back. This behaviour is inherited from Peoplepicker of Office Fabric UI - link
Hopefully this answers the query above.

I might follow up with the Fabric team with this change and get something on it but from SPFx react control it mightn't change much as we default the behaviour from parent Office Fabric component.

If that works, please let us know and we could close it.

[mwahlia]

Thank you @AsishP, I can see that in the Fabric demo. But the issue I have is not the same. Even if I click outside the box and then inside again, suggested people does not show up.

[AsishP]

@mwahlia, ok. If possible and if you are not using any other SPFx react controls in it, could you try to decrease the SPFx React controls to 1.7.0 and check. Few of my contacts had issues with 1.8.0 and have to tell them to switch back to 1.7.0 for people picker till they are fixed.

To install a specific version, use npm install @ —save —save-exact

[mwahlia]

@AsishP, I can confirm that you are right. It works as you describe in with version 1.7.0. Unfortunately, this version is missing some valuable props... The documentation of 1.8.0 declares that a fix was done for this, bur for me this version does not work. I´m not using any other pnp controls.

[estruyf]

This is indeed a bug which got introduced by leveraging v5.122.0 from Office UI Fabric. Will downgrade the Office UI Fabric version to the same level as the one being used in SPFx version 1.6.0 and test out this issue again + release a fix.

[estruyf]

I just released a new beta version with the fix in place. Would you be able to test it out? More information about installing a beta can be found here: https://sharepoint.github.io/sp-dev-fx-controls-react/beta/

[mwahlia]

@estruyf working fine! Thank you!

[estruyf]

Thank you @mwahlia for verifying. Will be in the next release soon.

[estruyf]

This will be available today in version 1.9.0.