Sp-dev-docs: SPFx extension samples not showing

[FabianAckeret]

Category

• [x] Question
• [ ] Typo
• [ ] Bug
• [ ] Additional article idea

Expected or Desired Behavior

To see the extension samples when executing gulp serve

Observed Behavior

I've tried several samples SPFx extensions. All samples have the same outcome when it comes to testing (gulp serve) after following the instructions on the samples page. Most of them just require npm install and adjustments in the serve.json file. However, every time I'm testing it, the extension somehow is not loaded. I won't get an error or anything, but it just doesn't load/execute.
Even when I'm following the helloworld tutorial on the official tutorial series, the extension won't show (except the alert from the very first step).

I also tried on different machines and in different networks, but I was never able to get the samples to do something.

Does anyone have an idea?

Steps to Reproduce

Download the sample js-command-clone, run npm install in a console and adjust config/serve.json with a list view of your choice. Run gulp serve

[msft-github-bot]

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

[PopWarner]

Hi @isabasu

Thanks for submitting your question. Could you provide a little more detail around your specific environment. Are you testing this with SPO or OnPrem? What version of SPFx are you testing with?

I also noticed the tutorial sample you linked to was for the sample web part, but your title mentions using extensions.

Did you happen to try using the tutorial found here:
https://docs.microsoft.com/en-us/sharepoint/dev/spfx/extensions/get-started/build-a-hello-world-extension

:)

[FabianAckeret]

Thanks for your quick answer.

Sorry about the link - I adjusted it in the original post. I meant this one => https://docs.microsoft.com/en-us/sharepoint/dev/spfx/extensions/get-started/using-page-placeholder-with-extensions

I'm testing with SharePoint Online in the serve.json file.

Node.js version: 10.15.3
npm version: 6.4.1
gulp version: 2.1.0

[PopWarner]

Thanks @isabasu

I'm not sure if its the only issue causing your ext to not work, but SPFx hasn't upgraded to Node 10.x support.

Best to double check and ensure your development environment is setup in alignment with what's documented here:
https://docs.microsoft.com/en-us/sharepoint/dev/spfx/set-up-your-development-environment

:)

[FabianAckeret]

Thanks for the hint. I just tried it with node version 8.15 on one computer and with node version 8.12 on another. Same behavior. Unfortunately, this is happening for all the samples I've tried so far.

I assume the following actions are correct since it says on almost all samples that the "minimal path to awesome" is the following:

1. Copy the sample folder
2. Adjust the serve.json according to my tenant
3. Navigate into the folder within powershell
4. Enter npm install
5. Use gulp serve to test.

Thanks for your time and help :)

[patmill]

Node 10 shouldn't be the issue. What happens with gulp serve? Does it build correctly? Does a browser pop up? What's the URL of it? etc.

[FabianAckeret]

Gulp serve opens up the browser correctly and redirects me to

https://mytenant.sharepoint.com/sites/mysite?loadSPFX=true&debugManifestsFile=https://localhost:4321/temp/manifests.js&customActions={"bf6645bd-42e4-4a30-aad7-6ff12d61fa1f":{"location":"ClientSideExtension.ListViewCommandSet"}}

[PopWarner]

Looks like by the customActions guid, you are testing out the 'js-command-clone' sample that you had referenced in a previous comment. I just pulled down this sample and tested it myself and it seems to work for me.

I did notice that your URL was not pointing at a list though? This is a ListView extension and based on the code in the sample will work when you test it within a list and select a list item.

So here is the URL that works for me:

https://MyTenant.sharepoint.com/sites/MySITE/Lists/CloneCommand/AllItems.aspx?debugManifestsFile=https://localhost:4321/temp/manifests.js&loadSPFX=true&customActions={"bf6645bd-42e4-4a30-aad7-6ff12d61fa1f":{"location":"ClientSideExtension.ListViewCommandSet","properties":{}}}

Here is a screen snippet of how I was able to get it to activate:

My list is a simple list I just created and added just one list item and selected it.

If you do the same, does the "Clone" button show up for you? :)

[FabianAckeret]

Hi @PopWarner

Thanks for testing it out and letting me know.
I realized I had a different URL in my clipboard, but it was actually redirecting me to the following URL:

https://MYTENANT.sharepoint.com/sites/MYSITE/Lists/MYLIST/AllItems.aspx?debugManifestsFile=https%3A%2F%2Flocalhost%3A4321%2Ftemp%2Fmanifests.js&loadSPFX=true&customActions=%7B%22bf6645bd-42e4-4a30-aad7-6ff12d61fa1f%22%3A%7B%22location%22%3A%22ClientSideExtension.ListViewCommandSet%22%2C%22properties%22%3A%7B%7D%7D%7D

When I tried it again today, I actually got the following message the first time I opened it:

Error loading debug script. Ensure the server is running and the "debugManifestFile" parameter URL is correct.
Error: Script error for "https://localhost:4321/temp/manifests.js" http://requirejs.org/docs/errors.html#scripterror

When I try your URL the clone function works perfectly fine which is great. So I thought I'll give it another try with simply gulp serve and it worked seemlessly.
Since this was kinda weird I completely deleted the js-command-clone extension and tried everything again. I realized that gulp serve won't work, but as soon as I add the "debug URL" manually from the sample instructions it is working. From this moment onwards also gulp serve works.

Any idea why that is? I assume it has something to do with the error message I received regarding the debugManifestFile?

Thanks again! :-)

[FabianAckeret]

@PopWarner
Any idea why that is or how to prevent it?

[PopWarner]

@isabasu, my apologies for the delay in responding.

Normally I get that error if the "gulp serve" has not been executed and the localhost instance of the SPFx solution is not running.

Or it could also be your running the gulp serve, but the browser has not trusted the path for your localhost instance.

Before testing your extension, perhaps first try navigating directly to: https://localhost:4321 and check for any issues starting there? :)

[FabianAckeret]

@PopWarner No worries at all. I'm thankful for your responses :-)

I added localhost to my trusted sites and also tried to access https://localhost:4321 after gulp serve. I can access https://localhost:4321 (listing directory), but I still get the error message mentioned above with gulp serve.
Some of my colleagues tried it as well with the same outcome. May I know what versions you're running? I really can't tell anymore what else could be the cause of all this :/

[PopWarner]

Hmmm. I’m a little confused. Is it no longer working for you?

In one of your recent messages you said when you paste a properly formatted URL, it was working for you?

I think, if I understand accurately that you said when you let the gulp serve open the browser it doesn’t work, but when you paste in a URL, it does? (I might be wrong in my understanding, so forgive me if I am wrong.)

Have you also tested in multiple browsers to see if it’s a browser specific problem perhaps?

[FabianAckeret]

@PopWarner

Sorry for any confusions caused.
Well yeah, it used to work when I took "your" URL, that is true. However, since this is super strange and is probably also the cause of why other extensions are not properly working, I went ahead and did it all over again.

That means:

1. Downloaded and extracted js-command-clone
2. npm install in that folder
3. Adjusted serve.json with this link: https://MYTENANT.sharepoint.com/sites/MYSITE/Lists/MYLIST/AllItems.aspx
4. gulp serve

That is causing again this error message from above (including the manifests.js file) to show up.
When I use your URL it doesn't work anymore as it did before. For whatever reason... So I did it again on another machine with the same result.

I did another test with react-application-breadcrumb which has the same behavior.

[PopWarner]

@isabasu and in that process if you load the https://localhost:4321 URL it loads ok? After that, if you try the pasted URL, does it still fail?

Also, in the process of your steps 1-4, when your URL from step 3 loaded, did you still get the "Error: Script error for "https://localhost:4321/temp/manifests.js" error?

[FabianAckeret]

@PopWarner
Thanks for getting back to me and I appreciate your time!

Today morning I just tried it again (no changes have been done since yesterday).

Actions taken today morning (checkmark indicates success/no checkmark failure):

• [x] Accessing https://localhost:4321 after gulp serve for js-command-clone
• [ ] Accessing https://localhost:4321 after gulp serve-info --nobrowser for react-application-breadcrumb
• [x] Extension works for js-command-clone
• [ ] Extension works for react-application-breadcrumb

I feel like this is super strange. Since my last test yesterday I didn't change anything and back then it didn't work. Today morning, first thing, I just tried gulp serve (respectively gulp serve-info --nobrowser according to the react-application-breadcrumb tutorial - it goes without saying that I opened up a browser as well and added the debug link from the tutorial to my URL), again as mentioned in the actions and it worked (at least for js-command-clone)

As for your other question: Yes, for the react-application-breadcrumb I did still get the same message.

[PopWarner]

Hmmm. Are you on ‘Targeted Release’?

I know there has been some issues the last few days with command set ext for those on Targeted Release, but believe it’s been fixed. That could have been part of the issue of you seeing it work and then not and now work again.

So sounds like your good to there for the clone sample.

I had not tested the react sample myself, but can later tonight or over the weekend. Does a brand new ext or other samples work for you? :)

[FabianAckeret]

Indeed we're on Targeted Release - on both tenants I've tried with. Maybe they haven't pushed the fix to our tenants yet - I'll try next week again with the same steps.

Oh that'd be super nice of you if you could test it as well :-)

Other samples mostly have the same behavior or another issue. However, I tested around 6-7 extenions so far and got only the clone one to work yet. I'll go ahead and test some more this weekend/next week and check if they all end up with the same manifests.js error. Will keep you posted :-)

Thanks again for your time so far!

[PopWarner]

My pleasure. Thanks for your patience on working through it. :)

[FabianAckeret]

@PopWarner
Thanks again.

I've tested some of the extensions with the following outcome. The ones which didn't work couldn't reach https://localhost:4321 nor https://localhost:5432:

• [x] [jquery-application-toastr](https://github.com/SharePoint/sp-dev-fx-extensions/tree/master/samples/jquery-application-toastr)
• [x] [Js-command-selectedItems-export](https://github.com/SharePoint/sp-dev-fx-extensions/tree/master/samples/js-command-selecteditems-export)
• [x] [Jquery-command-copy-classic-link](https://github.com/SharePoint/sp-dev-fx-extensions/tree/master/samples/js-command-copy-classic-link) | didn't work at first try with gulp serve --config=copyClassicLinkToastr so I tried with gulp serve --config=copyClassicLinkSwal which worked. Then I tried again gulp serve --config=copyClassicLinkToastr immediately after and it worked
• [ ] [jquery-field-itemorder](https://github.com/SharePoint/sp-dev-fx-extensions/tree/master/samples/jquery-field-itemorder) | manifests.js error
• [ ] [Js-command-item-permissions](https://github.com/SharePoint/sp-dev-fx-extensions/tree/master/samples/js-command-item-permissions) | Manifests.js error
• [ ] [React-application-breadcrumb](https://github.com/SharePoint/sp-dev-fx-extensions/tree/master/samples/react-application-breadcrumb) | Manifests.js error
• [ ] [React-application-duetasks](https://github.com/SharePoint/sp-dev-fx-extensions/tree/master/samples/react-application-duetasks) | Manifests.js error

I assume all these are due to one cause: localhost not reachable. However, do you have an idea why it wouldn't be reachable? I was following the instructions of all of them on the samples pages.

[FabianAckeret]

One more question I'd like to ask for clarifying:
My SharePoint site doesn't need to be a developer site, right? It can just be any site of my choice. Are the developer sites even needed anymore, nowadays?

[PopWarner]

One of the challenges with some of the samples is they are not always updated as newer versions of SPFx are released.

While I don’t believe that is directly the reason for your experience, it’s not entirely out of the question that perhaps there are module version conflicts possibly causing some oddity.

Again I wouldn’t think this directly impacts the ability for your browser to access your manifests.js via localhost.

With each of the samples, I’m assuming there were no errors in the gulp serve process?

Per your last question your site does not need to be a developer site.

One thought I do have is I think we have mostly been testing with a variety of samples. One thought is what kind of success do you have if you simply scaffold out a fresh, brand new web part and extension, perhaps an application customizer, in separate solutions?

Do you experience success with each? :)

[FabianAckeret]

@PopWarner
sorry for my late answer. Lot of things going on currently...

To answer your questions:

1. gulp serve runs successfully. I don't get any errors
2. I hope I understood you correctly. I've created a new extension (application customizer), adjusted the site in serve.json and immediately after ran gulp serve. This worked well. I was also able to reach https://localhost:4321. However, I didn't quite get what you meant with
   > in separate solutions

Have you tried the extensions which didn't work for me?

Thanks again for your time so far!! :-)

* edit *
Also created a new webpart and everything works fine with gulp serve

[PopWarner]

No problem on the delay. I completely understand. :)

My apologies for not being clear. What I meant by separate solutions was one solution for the application customizer and then a different solution for a web part.

Was mainly just curious if a newly scaffolded version of each ran successfully for you. :)

[FabianAckeret]

@PopWarner
No you were more than clear, it's just that I'm quite new to this and what might look obvious to others isn't to me :-P

Yes it was running successfully (un)fortunately. Have you had time to test the extensions which didn't work for me?

[PopWarner]

I apologize, I have not been able to test the different sample extensions you were having trouble with. That being said though, they all have a variety of SPFx version differentials and my thought is if that is causing some of the oddity your experiencing? That's why I was curious if a fresh scaffolding of an SPFx 1.8 webpart or ext was working for you. :)

It's possible that an update of them to SPFx 1.8, perhaps using the CLI, might make them successful for you? Just a thought, not by any means the answer.
Not sure if you have had any experience with that, but here is some of the documentation on using that CLI feature:
https://pnp.github.io/office365-cli/cmd/spfx/project/project-upgrade/

:)

[s3rb31]

I have the same problem. I just tried multiple examples (this and this) and none of them worked after a gulp serve.

The link I entered in serve.json is https://censored.sharepoint.com/Lists/MRTestList/AllItems.aspx with MRTestList being a newly created list looking like this:

Whenever I first (ONLY on first run) runned gulp serve Sharepoint complained about https://localhost:4321/temp/manifests.js not being reachable although I can view it in my browser with no problem and I trusted the dev certificate via gulp trust-dev-cert.

(Sicher = secure, Gültig = valid)

There is no error message when I try it again afterwards but it still does not work. Also npm install seems to finish just fine the only warning I can spot is:

npm WARN optional SKIPPING OPTIONAL DEPENDENCY: [email protected] (node_modules\fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for [email protected]: wanted {"os":"darwin","arch":"any"} (current: {"os":"win32","arch":"x64"})

added 1766 packages from 1760 contributors and audited 280561 packages in 175.861s
found 1484 vulnerabilities (1180 low, 94 moderate, 203 high, 7 critical)
  run `npm audit fix` to fix them, or `npm audit` for details

Which does not seem to be relevant? I am kinda new to nodejs so I can't really tell ...

The gulp serve output looks like this:

C:\Users\User\Desktop\sp-dev-fx-extensions-master\samples\js-command-clone>gulp serve
Build target: DEBUG
[23:41:13] Using gulpfile ~\Desktop\sp-dev-fx-extensions-master\samples\js-command-clone\gulpfile.js
[23:41:13] Starting gulp
[23:41:13] Starting 'serve'...
[23:41:13] Starting subtask 'configure-sp-build-rig'...
[23:41:13] Finished subtask 'configure-sp-build-rig' after 8.04 ms
[23:41:13] Starting subtask 'spfx-serve'...
[23:41:13] Finished subtask 'spfx-serve' after 420 ms
[23:41:13] Starting subtask 'pre-copy'...
[23:41:13] Finished subtask 'pre-copy' after 11 ms
[23:41:13] Starting subtask 'copy-static-assets'...
[23:41:13] Starting subtask 'sass'...
[23:41:14] Server started https://localhost:4321
[23:41:14] LiveReload started on port 35729
[23:41:14] Opening https://syscom365.sharepoint.com/Lists/MRTestList/AllItems.aspx?debugManifestsFile=https%3A%2F%2Flocalhost%3A4321%2Ftemp%2Fmanifests.js&loadSPFX=true&customActions=%7B%22bf6645bd-42e4-4a30-aad7-6ff12d61fa1f%22%3A%7B%22location%22%3A%22ClientSideExtension.ListViewCommandSet%22%2C%22properties%22%3A%7B%7D%7D%7D using the default OS app
[23:41:14] Finished subtask 'sass' after 945 ms
[23:41:14] Starting subtask 'tslint'...
[23:41:15] Starting subtask 'typescript'...
[23:41:15] [typescript] TypeScript version: 2.4.2
Warning: no-duplicate-case rule is deprecated. Replace your usage with the TSLint no-duplicate-switch-case rule.
Warning: valid-typeof rule is deprecated. Replace your usage with the TSLint typeof-compare rule.
[23:41:16] Finished subtask 'copy-static-assets' after 2.45 s
[23:41:17] Finished subtask 'tslint' after 2.88 s
[23:41:17] Finished subtask 'typescript' after 1.86 s
[23:41:17] Starting subtask 'ts-npm-lint'...
[23:41:17] Finished subtask 'ts-npm-lint' after 10 ms
[23:41:17] Starting subtask 'api-extractor'...
[23:41:17] Finished subtask 'api-extractor' after 806 μs
[23:41:17] Starting subtask 'post-copy'...
[23:41:17] Finished subtask 'post-copy' after 450 μs
[23:41:17] Starting subtask 'collectLocalizedResources'...
[23:41:17] Finished subtask 'collectLocalizedResources' after 5.17 ms
[23:41:17] Starting subtask 'configure-webpack'...
[23:41:18] Finished subtask 'configure-webpack' after 653 ms
[23:41:18] Starting subtask 'webpack'...
  Request: '/temp/manifests.js'
  Request: '/lib/extensions/spfxClone/loc/en-us.js'
[23:41:19] Finished subtask 'webpack' after 1.51 s
[23:41:19] Starting subtask 'configure-webpack-external-bundling'...
[23:41:19] Finished subtask 'configure-webpack-external-bundling' after 1.19 ms
[23:41:19] Starting subtask 'copy-assets'...
  Request: '/dist/spfx-clone-command-set.js'
[23:41:19] Finished subtask 'copy-assets' after 68 ms
[23:41:19] Starting subtask 'write-manifests'...
[23:41:19] Warning - [write-manifests] The icon path "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAFbSURBVDhPtZOtTgNBEIBnb/cA0WS3FwiGhD4AAolE8AAIBALLGyARJBUIFApTX4HkARDICiQCUVHRkOve8dOkQEuXmWOOHHcLreFLNjc7/3s7Cz6SwBwkSvcSZRwtq0xslT5i82wwqJ+GepO3MIBoDXWjB1ipseqbgL8lxPnUiU4q9Xa6qBuBmvaEc61ViIfsMBuseJ0nwCN0WV3hlw7m538SdGF9yQE0JsIN398WXlFlnqG2/GX9iTeBlk9NgQkkBJ1Qjfsom4lSF2z+m4GKtugaixXp+hJp7gZS77HKD7atrDS3uWMxiS9xBSv1CTpdkozfNq4RJjzNjAh2cZbbK9Dk5RWyTnB8KYA6Ypfs53qPUm6dsEF9H+f/CnU7tI+l3qXB8h6l2LoPG9Y3KAgf2EsK2vBR2mxGBxzV4uMpw0H3WOgm32PMmGS8YlRI3XRCHJM8Nw5a0cfj4ScBDIzf6gQVQAAAAABJRU5ErkJggg==" appears to be a relative web URL. This means that when the is rendered, this URL will be relative to the CDN url for the rest of the package assets. If a relative filesystem path was intended, prepend the path with "./".
[23:41:20] Finished subtask 'write-manifests' after 726 ms
[23:41:20] Starting subtask 'reload'...
[23:41:20] Finished subtask 'reload' after 1.58 ms
  Request: '/dist/spfx-clone-command-set.js'
  Request: '/dist/spfx-clone-command-set.js'

So what is going sideways here? Why are the examples not working? Where do I even have to look for an error message or something failing? Currently I am puzzled really ...

EDIT: Forgot to include the versions of the tools that I am using:

C:\Users\User\Desktop\sp-dev-fx-extensions-master\samples\js-command-clone>npm --version
6.4.1

C:\Users\User\Desktop\sp-dev-fx-extensions-master\samples\js-command-clone>node --version
v8.16.0

C:\Users\User\Desktop\sp-dev-fx-extensions-master\samples\js-command-clone>gulp --version
CLI version: 2.2.0
Local version: 3.9.1

[DA-Mena]

I'm having the same issue with the SPFx clone solution and then tried a new yeomen project, same result. The files get served but nothing executes. I even build solution into package to deploy and still nothing.

• Using SPFx ver 1.8.1
• Created new project
• Select listview command application and let the boilerplate finish
• npm install and made sure my pageUrl replaced with relevant url
• gulp serve, files are requested from the logs in node terminal
• Example doesn't even execute, nothing happens...

https://localhost:4321/temp/manifests.js is always hosted

[DA-Mena]

This is ridiculous...files are served but not recognized on SharePoint online...

[PopWarner]

@DA-Mena, when you packaged and deployed, did you use the --ship for production use?

I tested a new CommandSet extension freshly created and debugging it from my localhost, I get the same experience with the files being served, but no execution of my methods.

I did though package it up, using --ship for production use and when deployed, it does work successfully. Wanted to see if I did an apples to apples test with how you tested? :)

[patmill]

So I know that the lists team is working on some issues with the updated list UX. In the meantime - What is the URL you are hitting to try and get your solution to run?

[DA-Mena]

@PopWarner I did gulp bundle --shipand gulp package-solution --ship and oddly enough it's executing now (the clone solution example still doesn't execute however which is updated to 1.8.1 from using o365 cli)

bundle --ship + package-solution also works so I'm able to at least debug on the fly.

[nsksaisaravana]

I am also having the same issue for one tenant, the same solution is working perfectly for the other tenant. It is really very weird, SPFX always breaks something when a new feature is getting released. Please don't break something which already working perfectly.

[patmill]

OK, spent a bunch of time trying to sort this out, and I'm unable to repro it with the changes that have rolled. (although I don't doubt that there were issues). Can you do me a favor and try this again, and if you are having issues, open up the dev tools, look at the sources, and see what the path for the code is? Specifically, what is the path that looks a lot like this - 'https://spoprod-a.akamaihd.net/files/odsp-next-prod_2019-04-26-sts_20190508.002/'? It should be the path for a bunch of the .js files, like
https://spoprod-a.akamaihd.net/files/odsp-next-prod_2019-04-26-sts_20190508.002/en-us/splistdeferred-is-mini.resx-f47374cc.js

@isabasu - the require.js error is a bit strange to see. Where did you get your tenant? Do you mind sharing the tenant name?

[zachroberts8668]

@patmill my list view command set will work fine when I am using a list in my 'Developer' site collection but when I adjust the serve.json file to point to a different list in another site collection the commands will not show up. I tried packaging my solution and uploading it to the app directory and adding the app to the site that the list resides and still they do not show.

For your question above I see the following path when I open up dev tools and look at the sources you requested. https://spoprod-a.akamaihd.net/files/odsp-next-prod_2019-04-26-sts_20190508.002/splistdeferred-is-mini-3d3f3c15.js

[patmill]

Yup - sorted out why I couldn't repro these issues. The switch from standard release to targeted release takes a lot longer to take effect now. I thought I was switched over, but I wasn't.

[georgenorberg]

I'm developing a field customizer extention:

• Using SPFx version 1.8.1
• Node v10.15.3
• tried multiple projects. Including following the basic getting stared example.
• I've recently strated a new VM in Azure as dev machine. and installed / set up env according to

I've developed field customizers in the past on prev. versions on SPFX and not had any issues.

I tried on two different tenants and on one it worked. So targeted release seems to be the issue.

[patmill]

Correct. The list/library team is working on a few issues around targeted release users and extensions. This should be addressed soon. In the mean-time, deploying a non-ship build to a test site should allow you to keep a similar fast inner loop (the code will be served from your local machine). It won't work for anyone else though - they will get errors about not being able to load the .js files.

[phillipharding]

Tried a ListView Command-set extension today using SPFx 1.8.2 and have the same problems with Commands not showing when using gulp serve

My tenant is on Targeted Release, packaging the solution and deploying to the app catalog, then adding the solution to a site does cause the commands to show as expected.

[MadsAnker]

I had the same problem a while back. Switching from Targeted Release to Standard Release fixed the problem.

[barisbikmaz]

Having the same issue that gulp serve does not show commands now in a developer tenant in standard release. This worked a few days ago.

[siddharth-vaghasia]

Same issue...command set not showing for target release....anyone found any solution ?

[nilokillian]

Faced the same issue using SPFx 1.8.2. "onInit()" isn't being triggered at all

[zachroberts8668]

Hi Siddharth,

You will have to change yourself or your tenant from targeted release to standard release for the command sets to show up. Worked for me after switching from targeted to standard on 1.8.1 and 1.8.2

EDIT: I take that back I was working on a command set and today it stopped showing up in my list. I am on standard release. I will try switching back to targeted to see if that works.

Yep I am seeing the same thing it was working fine the other day and now i can not get list command set extensions to show up. OnInit() does not execute. Standard and Targeted release.

[jchilde]

SPFX 1.8.2 field customizer on either Targeted or Standard release not hitting OnInit(). Tested Chrome, Edge, and IE11. Tested on O365 Group and non-O365 Group. Tested on development and non-development tenant.

[PopWarner]

Hi @jchilde. I know Microsoft is working on getting this sorted out for the extensions.

There is another thread on a similar topic for CommandSet Extensions and some workaround that have been working there until everything get's sorted out.

Here is a link to what has been working for me: https://github.com/SharePoint/sp-dev-docs/issues/3914#issuecomment-491069227

It's not the most ideal workaround, but it might allow you to keep progressing in your development efforts. :)

[zachroberts8668]

Hi @PopWarner unfortunately your work around is not working for me 😟. I tried against my tenant standard and targeted release and against my developer tenant with everything on targeted release and could not get the commands to show for the list or OnInit to run. Tried with a fresh list view command set from the yeoman generator and no luck.

[PopWarner]

Hi @zachroberts8668.

Thanks for the update. Couple questions, were you deploying to a site app catalog or a tenant app catalog? If a tenant, were you making it available to all sites or requiring it to be installed manually? :)

[zachroberts8668]

@PopWarner Thank you! I completely missed that in your other message and was using my tenant app catalog, once I placed it in a site app catalog it started working!

Thank you!! 😄

[PabloFederico]

Same error, today I have the same error with a List View Command

[andrewconnell]

This workaround may help: https://github.com/SharePoint/sp-dev-docs/issues/4374#issuecomment-516815819.

Appears a regression was introduced at some point that caused the wrong URL to be generated by gulp serve which isn't telling SPO to load SPFx onto the page if it isn't already there.

Hey OP @isabasu, please try this and report back if it resolves your issue.

[FabianAckeret]

@andrewconnell

I just tested this, but without success, I'm afraid. Error stays the same - "script error for .../manifests.js"

[patmill]

Are you building against 1.9.0 ?

[andrewconnell]

@isabasu In addition to @patmill's question, can you provide a link to a public repo that repro's the problem as I'm not able to repro your issue with SPO & SPFx v1.8.2

[andrewconnell]

Also note, the sample you reference is nearly 2yrs old according to the timestamps. The samples in that library are just community samples with no support or anyone updating them for every new release. Microsoft just created a repo here people could post samples...

[TheThor59]

Hello,
On my side I have the same trouble, I don't have the "script error" message but the init is not fired at all. I've only the "script error" message when the page loads too quickly vs the local server, refresh the page make the error disappear. The real issue (not firing the init) is present on my code even if I use the default "js-command-clone" solution or I use the yeoman generated default template.
The version I tested 1.4.0, 1.8.0 & 1.8.2, none of them worked. The yeoman template I used was the 1.8.2 with list command extension model.
@andrewconnell How did you do to have a solution working ? did you used yeoman template ? used a project sample ? can you provide us the template you used ?
Thanks

[andrewconnell]

@TheThor59 said:

How did you do to have a solution working ? did you used yeoman template ? used a project sample ? can you provide us the template you used ?

Not clear... this thread is about the SPFx samples... I haven't tried those as I haven't seen a specific one referenced. Simply changing the version of SPFx that you're running won't magically fix it. All depends on which sample you're trying to use. Nothing magical about old code... sometimes it works, sometimes it needs to be updated... all depends and can't answer your question without knowing which sample isn't working.

Using the default new project created with SPFx v1.8.2 that contains an app customizer & tested in SPO works fine for me.

[msft-github-bot]

This issue has been automatically marked as stale because it has marked as requiring author feedback but has not had any activity for 7 days. It will be closed if no further activity occurs within next 7 days of this comment. Thank you for your contributions to SharePoint Developer activities.

[FabianAckeret]

• [ ] jquery-field-itemorder | manifests.js error
• [ ] Js-command-item-permissions | Manifests.js error
• [ ] React-application-breadcrumb | Manifests.js error
• [ ] React-application-duetasks | Manifests.js error

I assume all these are due to one cause: localhost not reachable. However, do you have an idea why it wouldn't be reachable? I was following the instructions of all of them on the samples pages.

I'm testing with SharePoint Online in the serve.json file.

Node.js version: 10.15.3
npm version: 6.4.1
gulp version: 2.1.0

Sorry for the late answer.
These are some samples which didn't work for me. Also, you can find the version I was using.

[andrewconnell]

One of those is SPFx v1.2... which means it was during the extensions dev preview. The others are very old... even the timestamps say they haven't been touched in 2yrs. You'd need to look at each one and see what's wrong with it or recreate it using a more current version of SPFx.

The samples in that repo (and the associated web part repo) are not maintained by anyone

If you're having issues with those examples, the correct place to submit questions is THAT repo's issue list, not in in this generic one.

[msft-github-bot]

Issues that have been closed & had no follow-up activity for at least 7 days are automatically locked. Please refer to our wiki for more details, including how to remediate this action if you feel this was done prematurely or in error: Issue List: Our approach to locked issues