Sp-dev-fx-webparts: react-tree-orgchart : Spinning round with message "Loading Organization Chart ..." and nothing Loading

[tienou]

Sample

react-tree-orgchart

Authors

@joaojmendes

Expected or Desired Behavior

Spinning round with message "Loading Organization Chart ..." and nothing Loading

Steps to Reproduce

1. Add Tree-OrgChart Webpart

Environment Details

Target environment : SharepointOnline

[msftbot[bot]]

Thank you for reporting this issue. We will be triaging your incoming issue as soon as possible.

[mpaukkon]

I noticed same behavior in our production tenant, when Show only my team setting is set to false.
I investigated a little bit and found out that web part actually fetches all profiles in your organization's structure. It will generate a lot of calls to getpropertiesfor REST endpoint.

[tienou]

I noticed same behavior in our production tenant, when Show only my team setting is set to false.
I investigated a little bit and found out that web part actually fetches all profiles in your organization's structure. It will generate a lot of calls to getpropertiesfor REST endpoint.

For me it's always "Loading Organization Chart ..." and nothing Loading

[hugoabernier]

@tienou can you try opening your browser's Developer Tools and see if you see any errors reported in the console?

It should look like this (this is just an unrelated sample, your error should be different)

[tienou]

@tienou can you try opening your browser's Developer Tools and see if you see any errors reported in the console?

Hello, thanks @hugoabernier

Yes i have a lot of errors :
The service worker navigation preload request was cancelled before 'preloadResponse' settled. If you intend to use 'preloadResponse', use waitUntil() or respondWith() to wait for the promise to settle. sp-pages-assembly_fr-fr_02f90020ea7c6f37b6dbab8a27342512.js:1 Avertissement !L’utilisation de cet outil vous expose à des menaces potentielles liées à la sécurité. Des personnes pourraient obtenir l’accès à vos données Office 365 personnelles (documents, courriers, conversations, etc.). Avant de continuer, vérifiez que la personne ou l’organisation qui vous a demandé d’accéder à cet outil est digne de confiance.En savoir plus ici : https://technet.microsoft.com/en-us/library/bb794823.aspx publiccdn.sharepointonline.com/genesienne.sharepoint.com/sites/AppCatalog/ClientSideAssets/390efafd-9a76-4778-9251-67c40bf0692e/cdb-google-search-web-part_96e383c4dbaf87bc57335e4d78f0634c.js:15 t(t){var n=e.call(this,t)||this;return n._rootElement=i.createRef(),n._inputElement=i.createRef(),n._onClickFocus=function(){var e=n._inputElement.value;e&&(n.focus(),e.selectionStart=e.selectionEnd=0)},n._onFocusCapture=function(e){n.setState({hasFocus:!0}),n._events.on(n._rootElement.current,"blur",n._onBlur,!0),n.props.onFocus&&n.props.onFocus(e)},n._onClearClick=function(e){var t=n.props.clearButtonProps;t&&t.onClick&&t.onClick(e),e.defaultPrevented||n._onClear(e)},n._onKeyDown=function(e){switch(e.which){case 27:n.props.onEscape&&n.props.onEscape(e),e.defaultPrevented||n._onClear(e);break;case 13:n.props.onSearch&&n.state.value.length>0&&n.props.onSearch(n.state.value);break;default:if(n.props.onKeyDown&&n.props.onKeyDown(e),!e.defaultPrevented)return}e.preventDefault(),e.stopPropagation()},n._onBlur=function(e){n._events.off(n._rootElement.current,"blur"),n.setState({hasFocus:!1}),n.props.onBlur&&n.props.onBlur(e)},n._onInputChange=function(e){var t=e.target.value;t!==n._latestValue&&(n._latestValue=t,n.setState({value:t}),n._callOnChange(t))},n._warnDeprecations({labelText:"placeholder",defaultValue:"value"}),n._latestValue=t.value||"",n.state={value:n._latestValue,hasFocus:!1,id:i.getId property 'labelText' was used but has been deprecated. Use 'placeholder' instead. s @ publiccdn.sharepointonline.com/genesienne.sharepoint.com/sites/AppCatalog/ClientSideAssets/390efafd-9a76-4778-9251-67c40bf0692e/cdb-google-search-web-part_96e383c4dbaf87bc57335e4d78f0634c.js:15 publiccdn.sharepointonline.com/genesienne.sharepoint.com/sites/AppCatalog/ClientSideAssets/4d7c1cea-0ef5-4143-88f6-43411d978b2f/portal-footer-application-customizer_6bd076db7f04985da845b9bb1c84c17c.js:29 SyntaxError: Unexpected token u in JSON at position 0 at JSON.parse (<anonymous>) at t.<anonymous> (publiccdn.sharepointonline.com/genesienne.sharepoint.com/sites/AppCatalog/ClientSideAssets/4d7c1cea-0ef5-4143-88f6-43411d978b2f/portal-footer-application-customizer_6bd076db7f04985da845b9bb1c84c17c.js:29) at i (publiccdn.sharepointonline.com/genesienne.sharepoint.com/sites/AppCatalog/ClientSideAssets/4d7c1cea-0ef5-4143-88f6-43411d978b2f/portal-footer-application-customizer_6bd076db7f04985da845b9bb1c84c17c.js:29) at Object.next (publiccdn.sharepointonline.com/genesienne.sharepoint.com/sites/AppCatalog/ClientSideAssets/4d7c1cea-0ef5-4143-88f6-43411d978b2f/portal-footer-application-customizer_6bd076db7f04985da845b9bb1c84c17c.js:29) at a (publiccdn.sharepointonline.com/genesienne.sharepoint.com/sites/AppCatalog/ClientSideAssets/4d7c1cea-0ef5-4143-88f6-43411d978b2f/portal-footer-application-customizer_6bd076db7f04985da845b9bb1c84c17c.js:29) publiccdn.sharepointonline.com/genesienne.sharepoint.com/sites/AppCatalog/ClientSideAssets/4d7c1cea-0ef5-4143-88f6-43411d978b2f/portal-footer-application-customizer_6bd076db7f04985da845b9bb1c84c17c.js:29 Current site is not part of an hub and the footer will fallback to local list of links. 6A cookie associated with a cross-site resource at <URL> was set without theSameSiteattribute. A future release of Chrome will only deliver cookies with cross-site requests if they are set withSameSite=NoneandSecure. You can review cookies in developer tools under Application>Storage>Cookies and see more details at <URL> and <URL>. /sites/Intranet/_api/web/lists/getByTitle('PnP-PortalFooter-Links')/items?$select=Title,PnPPortalLinkGroup,PnPPortalLinkUrl&$top=100&$orderby=PnPPortalLinkGroup%20asc,Title%20asc:1 Failed to load resource: the server responded with a status of 404 () sp-pages-assembly_fr-fr_02f90020ea7c6f37b6dbab8a27342512.js:1 Uncaught (in promise) Error: Failed to create application customizer 'ClientSideExtension.ApplicationCustomizer.df889434-1b1c-4f5b-ada3-086d948e4270'. Error information is 'Extension failed to initialize for componentId "df889434-1b1c-4f5b-ada3-086d948e4270".'. at sp-pages-assembly_fr-fr_02f90020ea7c6f37b6dbab8a27342512.js:1 at async Promise.all (index 0) sp-pages-assembly_fr-fr_02f90020ea7c6f37b6dbab8a27342512.js:1 [Deprecation] chrome.loadTimes() is deprecated, instead use standardized API: Paint Timing. https://www.chromestatus.com/features/5637885046816768. e._checkTTI @ sp-pages-assembly_fr-fr_02f90020ea7c6f37b6dbab8a27342512.js:1 spoprod-a.akamaihd.net/files/sp-client/chunk.vendors~sp-pages-search~sp-pages-search-b~f46164af_none_999fe2a950fe0c832c5f.js:1 Uncaught (in promise) undefined spoprod-a.akamaihd.net/files/sp-client/chunk.vendors~sp-pages-search_none_696f1bf73d675a1e3a2a.js:1 Some icons were re-registered. Applications should only call registerIcons for any given icon once. Redefining what an icon is may have unintended consequences. Duplicates include: GlobalNavButton, ChevronDown, ChevronUp, Edit, Add, Cancel, More, Settings, Mail, Filter (+ 1791 more) r @ spoprod-a.akamaihd.net/files/sp-client/chunk.vendors~sp-pages-search_none_696f1bf73d675a1e3a2a.js:1 /sites/Intranet?Mode=Edit:1 Refused to display 'https://login.microsoftonline.com/common/oauth2/authorize?response_type=id_token&client_id=89bee1f7-5e6e-4d8a-9f3d-ecd601259da7&redirect_uri=https%3A%2F%2Fwebshell.suite.office.com%2Fiframe%2FTokenFactoryIframe&state=3f2f36cc-6d1c-4d02-a30e-aeaa77969cb2&client-request-id=e2e92279-fd06-4987-abe6-12d2e04eed51&x-client-SKU=Js&x-client-Ver=1.0.15&nonce=2c240d17-749e-4185-89e7-29f3971c368c' in a frame because it set 'X-Frame-Options' to 'deny'. sp-pages-assembly_fr-fr_02f90020ea7c6f37b6dbab8a27342512.js:1 Uncaught (in promise) TypeError: Cannot read property 'TTIPolyfillSettings' of undefined at sp-pages-assembly_fr-fr_02f90020ea7c6f37b6dbab8a27342512.js:1 sp-pages-assembly_fr-fr_02f90020ea7c6f37b6dbab8a27342512.js:1 Uncaught (in promise) TypeError: Cannot read property 'TTIPolyfillSettings' of undefined at sp-pages-assembly_fr-fr_02f90020ea7c6f37b6dbab8a27342512.js:1 publiccdn.sharepointonline.com/genesienne.sharepoint.com/sites/AppCatalog/ClientSideAssets/d76a0c4f-d669-42eb-9533-68d5cec5e9d3/tree-org-chart-web-part_af2105391fa19f27aae52468dad94ce0.js:1 Uncaught (in promise) TypeError: Cannot read property 'substring' of undefined at t.<anonymous> (publiccdn.sharepointonline.com/genesienne.sharepoint.com/sites/AppCatalog/ClientSideAssets/d76a0c4f-d669-42eb-9533-68d5cec5e9d3/tree-org-chart-web-part_af2105391fa19f27aae52468dad94ce0.js:1) at publiccdn.sharepointonline.com/genesienne.sharepoint.com/sites/AppCatalog/ClientSideAssets/d76a0c4f-d669-42eb-9533-68d5cec5e9d3/tree-org-chart-web-part_af2105391fa19f27aae52468dad94ce0.js:1 at Object.next (publiccdn.sharepointonline.com/genesienne.sharepoint.com/sites/AppCatalog/ClientSideAssets/d76a0c4f-d669-42eb-9533-68d5cec5e9d3/tree-org-chart-web-part_af2105391fa19f27aae52468dad94ce0.js:1) at a (publiccdn.sharepointonline.com/genesienne.sharepoint.com/sites/AppCatalog/ClientSideAssets/d76a0c4f-d669-42eb-9533-68d5cec5e9d3/tree-org-chart-web-part_af2105391fa19f27aae52468dad94ce0.js:1) 4spoprod-a.akamaihd.net/files/sp-client/chunk.vendors~sp-suite-nav-search-common_none_d159586d9106e00bed4a.js:1 Uncaught (in promise) Error: Can not set initial state more than once. at f (spoprod-a.akamaihd.net/files/sp-client/chunk.vendors~sp-suite-nav-search-common_none_d159586d9106e00bed4a.js:1) at Module.u (spoprod-a.akamaihd.net/files/sp-client/chunk.vendors~sp-suite-nav-search-common_none_d159586d9106e00bed4a.js:1) at Module.C (spoprod-a.akamaihd.net/files/sp-client/chunk.sp-suite-nav-search-common_none_290bee60d1a6bc6b0abf.js:1) at sp-pages-assembly_fr-fr_02f90020ea7c6f37b6dbab8a27342512.js:1 DevTools failed to load SourceMap: Could not parse content for https://outlook.office.com/mail/owa.serviceworker.js.map: Unexpected token < in JSON at position 0 The FetchEvent for "https://genesienne.sharepoint.com/sites/Intranet/SitePages/Test-Contacts.aspx" resulted in a network error response: the promise was rejected. Promise.then (async) (anonymous) @ stsserviceworker.js:2 stsserviceworker.js:2 Uncaught (in promise) TypeError: Failed to execute 'fetch' on 'WorkerGlobalScope': 'only-if-cached' can be set only with 'same-origin' mode at stsserviceworker.js:2 (anonymous) @ stsserviceworker.js:2 IndexedDB (async) (anonymous) @ stsserviceworker.js:2 (anonymous) @ stsserviceworker.js:2 (anonymous) @ stsserviceworker.js:2 (anonymous) @ stsserviceworker.js:2 (anonymous) @ stsserviceworker.js:2 (anonymous) @ stsserviceworker.js:2 u @ stsserviceworker.js:2 (anonymous) @ stsserviceworker.js:2 (anonymous) @ stsserviceworker.js:2 (anonymous) @ stsserviceworker.js:2 (anonymous) @ stsserviceworker.js:2 (anonymous) @ stsserviceworker.js:2 u @ stsserviceworker.js:2 (anonymous) @ stsserviceworker.js:2 (anonymous) @ stsserviceworker.js:2 (anonymous) @ stsserviceworker.js:2 (anonymous) @ stsserviceworker.js:2 (anonymous) @ stsserviceworker.js:2 u @ stsserviceworker.js:2 (anonymous) @ stsserviceworker.js:2 (anonymous) @ stsserviceworker.js:2 (anonymous) @ stsserviceworker.js:2 (anonymous) @ stsserviceworker.js:2 DevTools failed to load SourceMap: Could not load content for chrome-extension://ndjpnladcallmjemlbaebfadecfhkepb/editor/config.js.map: HTTP error: status code 404, net::ERR_UNKNOWN_URL_SCHEME DevTools failed to load SourceMap: Could not load content for chrome-extension://ndjpnladcallmjemlbaebfadecfhkepb/editor/content.js.map: HTTP error: status code 404, net::ERR_UNKNOWN_URL_SCHEME DevTools failed to load SourceMap: Could not load content for https://publiccdn.sharepointonline.com/genesienne.sharepoint.com/sites/AppCatalog/ClientSideAssets/d76a0c4f-d669-42eb-9533-68d5cec5e9d3/fr-fr.js.map: HTTP error: status code 403, net::ERR_HTTP_RESPONSE_CODE_FAILURE DevTools failed to load SourceMap: Could not load content for https://static.sharepointonline.com/bld/_layouts/15/16.0.20203.12005/ActivityMonitor.js.map: HTTP error: status code 404, net::ERR_HTTP_RESPONSE_CODE_FAILURE DevTools failed to load SourceMap: Could not load content for https://oneshellprcorp.blob.core.windows.net/oneshellpr/20200607.1/crossdomainproxyiframe.map: HTTP error: status code 403, net::ERR_HTTP_RESPONSE_CODE_FAILURE DevTools failed to load SourceMap: Could not load content for https://oneshellprcorp.blob.core.windows.net/oneshellpr/20200607.1/bootstrapper.map: HTTP error: status code 403, net::ERR_HTTP_RESPONSE_CODE_FAILURE DevTools failed to load SourceMap: Could not load content for https://oneshellprcorp.blob.core.windows.net/oneshellpr/20200607.1/responsive.map: HTTP error: status code 403, net::ERR_HTTP_RESPONSE_CODE_FAILURE DevTools failed to load SourceMap: Could not load content for https://oneshellprcorp.blob.core.windows.net/oneshellpr/20200607.1/core.map: HTTP error: status code 403, net::ERR_HTTP_RESPONSE_CODE_FAILURE DevTools failed to load SourceMap: Could not load content for https://oneshellprcorp.blob.core.windows.net/oneshellpr/20200607.1/searchbox.map: HTTP error: status code 403, net::ERR_HTTP_RESPONSE_CODE_FAILURE DevTools failed to load SourceMap: Could not load content for https://oneshellprcorp.blob.core.windows.net/oneshellpr/20200607.1/plus.map: HTTP error: status code 403, net::ERR_HTTP_RESPONSE_CODE_FAILURE DevTools failed to load SourceMap: Could not load content for https://oneshellprcorp.blob.core.windows.net/oneshellpr/20200607.1/notifications.map: HTTP error: status code 403, net::ERR_HTTP_RESPONSE_CODE_FAILURE DevTools failed to load SourceMap: Could not load content for https://oneshellprcorp.blob.core.windows.net/oneshellpr/20200607.1/sb_strings.map: HTTP error: status code 403, net::ERR_HTTP_RESPONSE_CODE_FAILURE DevTools failed to load SourceMap: Could not load content for https://oneshellprcorp.blob.core.windows.net/oneshellpr/20200607.1/searchux.map: HTTP error: status code 403, net::ERR_HTTP_RESPONSE_CODE_FAILURE DevTools failed to load SourceMap: Could not load content for https://static.sharepointonline.com/bld/_layouts/15/16.0.20203.12005/ActivityMonitor.js.map: HTTP error: status code 404, net::ERR_HTTP_RESPONSE_CODE_FAILURE

[hugoabernier]

By looking at the errors, the only thing I see that seems to be related to the Org Chart that contains subsctring is the imageinitials.

I can't tell from the error whether it means that it can't find your/someone else's initials, or whether it can't load someone's profile.

Here's what I would suggest to diagnose the issue:

• Look at your profile in Delve and make sure you have a manager and/or direct reports
• Make sure you have initials and a display name on your profile
• Walk up the your manager's profile (and your manager's manager's profile, etc.) and check the same things.
• Repeat until you find a profile that is missing key information (or until you're done).

I'm not the author of the sample, but from what I can see, the author didn't put any extra code to handle exceptions (to keep the sample easy to follow) and something breaks when reading your org structure.

If you were to use this in a production environment, you'd definitely want to put exception handlers to handle any incomplete data.

Let us know what you find and maybe someone from the community can help adding code to handle such exceptions?

[joaojmendes]

Hello ,

Sorry , I’m only see this messages ☹ now … I don’t monitoring this email account frequently …..

You get this error when try to get initials from “DisplayName” attribute, ensure that user has the “DisplayName” defined in each user. I will fix this bug soon.

Thank you very much.

João

[hugoabernier]

@joaojmendes ok if I assign this issue to you?

[joaojmendes]

Hi @Hugo [e-mail],

I create a PR with the fix. 😊

Thank you for all your support ! 😊

[cid:[email protected]]

From: Hugo Bernier [e-mail]
Reply to: pnp/sp-dev-fx-webparts [e-mail]
Date: Friday, 12 June 2020 at 17:03
To: pnp/sp-dev-fx-webparts [e-mail]
Cc: João Mendes [e-mail], Mention [e-mail]
Subject: Re: [pnp/sp-dev-fx-webparts] react-tree-orgchart : Spinning round with message "Loading Organization Chart ..." and nothing Loading (#1324)

@joaojmendeshttps://github.com/joaojmendes ok if I assign this issue to you?

—
You are receiving this because you were mentioned.
Reply to this email directly, view it on GitHubhttps://github.com/pnp/sp-dev-fx-webparts/issues/1324#issuecomment-643352542, or unsubscribehttps://github.com/notifications/unsubscribe-auth/AC7YHVKUTRDALRURPXGUHELRWJGWPANCNFSM4NYHW5NA.

[tienou]

I create a PR with the fix. 😊>.

It works 👍 , I'm so happy :)
A very big thank you @joaojmendes
This web part is brilliant.