Closed FabianAckeret closed 5 years ago
Thank you for reporting this issue. We will be triaging your incoming issue as soon as possible.
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
:)
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
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
:)
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:
npm install
gulp serve
to test.Thanks for your time and help :)
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.
Gulp serve opens up the browser correctly and redirects me to
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:
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? :)
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:
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! :-)
@PopWarner Any idea why that is or how to prevent it?
@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? :)
@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 :/
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?
@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:
npm install
in that foldergulp 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.
@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?
@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):
gulp serve
for js-command-clonegulp serve-info --nobrowser
for react-application-breadcrumbI 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.
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? :)
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!
My pleasure. Thanks for your patience on working through it. :)
@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:
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 workedI 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.
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?
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? :)
@PopWarner sorry for my late answer. Lot of things going on currently...
To answer your questions:
gulp serve
runs successfully. I don't get any errorsgulp 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
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. :)
@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?
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/
:)
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: fsevents@1.2.8 (node_modules\fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@1.2.8: 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
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.
https://localhost:4321/temp/manifests.js is always hosted
This is ridiculous...files are served but not recognized on SharePoint online...
@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? :)
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?
@PopWarner I did gulp bundle --ship
and 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.
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.
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?
@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
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.
I'm developing a field customizer extention:
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.
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.
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.
I had the same problem a while back. Switching from Targeted Release to Standard Release fixed the problem.
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.
Same issue...command set not showing for target release....anyone found any solution ?
Faced the same issue using SPFx 1.8.2. "onInit()" isn't being triggered at all
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.
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.
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. :)
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.
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? :)
@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!! 😄
Same error, today I have the same error with a List View Command
Category
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 requirenpm 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. Rungulp serve