feat: added a new web-ext create command

[rpl]

This PR contains a prototype for a proposed approach to integrate create-webextension npm package into a new "web-ext create" command (which aims to fix #540) .

Internally, the "web-ext create" command prototyped in this PR uses libnpx (which is the "lib" version of the "npx" tool) to run the executable from the local dependency （using web-ext create --project-path="project1"), or optionally download and run the latest released version of the create-webextension npm package on the fly (using web-ext create --use-latest ...).

We could also support an additional --use-npm-version=... parameter (to be able to download and use a particular released version of the create-webextension npm package), as well as optionally supporting alternative npm packages as project generators.

(and we could also evaluate to use a similar approach for the "web-ext lint" command, so that we can allow the user to use a more updated version of the addons-linter even before a new "web-ext" version has been released).

• fix "spawn npm ENOENT" issue while discovering the npm root dir on windows (https://ci.appveyor.com/project/kumar303/web-ext/build/1.0.1206#L2831)
• add an additional unit test case (which would fix the coveralls error, related to the code coverage)

[coveralls]

Coverage decreased (-0.2%) to 99.757% when pulling 83fd6e1 on rpl:prototype/cmd-create-libnpx into 649c1c2 on mozilla:master.

[coveralls]

Coverage decreased (-0.2%) to 99.757% when pulling d07dda2 on rpl:prototype/cmd-create-libnpx into 649c1c2 on mozilla:master.

[coveralls]

Coverage decreased (-0.2%) to 99.757% when pulling 645a03d on rpl:prototype/cmd-create-libnpx into 649c1c2 on mozilla:master.

[hiikezoe]

@rpl the rest of work here is to write a unit test case, right? I've written it in https://github.com/hiikezoe/web-ext/commits/cmd-create-libnpx branch. Does it work for you? (There is a small fix to make the test pass in the branch)

Anyway, this command is pretty useful for me since writing manifest.json is the most troublesome thing when creating a new web extension. Thanks for the nice command!

[kumar303]

I mentioned this already on IRC but I think it would be nice if web-ext --verbose create ... were to somehow log the version of the create-webextension package in use. We will need to know this when getting bug reports from users.

Other than this, I like the idea of using libnpx, especially to let users define third party create templates.

[kumar303]

Shouldn't this be a required option? If so, it would be easier to pass in as an argument, like:

web-ext create my-project-path

[rpl]

yeah, right now I defined it as an additional yargs option to keep the initial version smaller and easier to evaluate, nevertheless I totally agree that make it just an additional required parameter would be way nicer for the user (and it is basically also as create-webextension works when used on its own).

[birtles]

Just curious, will this approach allow interactive prompts like vue-cli?

For example, some of the options I imagine would include:

• Which optional content pages are needed:
  • Options page?
  • Sidebar?
  • DevTools panel?
• TypeScript support? (adds webpack, webpack plugin, tsc, web extension types)
• Chrome support? (adds browser-polyfill)
• Unit testing? (adds jest? mocha? -- plus corresponding types as needed)
• Linting? (eslint / tslint as appropriate. prettier on commit?)
  (Once we have better support for e2e testing then presumably that would be an option too)

Given the number of permutations of options, I wonder if dynamically generating the appropriate skeleton is more scalable (and user-friendly) than fixed templates like create-react-app?

[birtles]

Oh, and one very minor nit which you may well have addressed already: it might be a bit odd if, after running web-ext create the user is prompted to install web-ext. I've suggested a solution to that over in rpl/create-webextension#8 however.

[Pomax]

bump - it's been more than half a year, can this still be rebased and landed? This is the kind of convenience that makes the difference between "annoying tool to use for anyone but devs who already know everything" and "the tool you recommend to your friends to use" =)

[Rob--W]

@rpl At the risk of feature creep - let's also make this part of the 3.0.0 release?

[rpl]

@rpl At the risk of feature creep - let's also make this part of the 3.0.0 release?

@Rob--W sure, let's add this to the features that we would like to include into web-ext 3.0.0, I would definitely like to get this done.

[rpl]

Closing as incomplete / do not merge, this PR also got branched out a long time ago, I would create a new branch if we will resume work on it.

[Pomax]

It would be encouraging to see a new issue filed, then, because given all the JS framework tooling that come with create commands (e.g. create-react-app, create-next-app, vue create ..., etc.) the fact that folks can't just go "install web-ext, run web-ext create extension-folder-name means that (through now fault of the web-ext project itself) there is a barrier to entry that doesn't need to be there. Especially when folks will still have to deal with the whole "chrome and firefox use different namespaces" issue after almost five years of web extensions in FF, that's something create can smooth over with a minimum of boilerplate =)

[willdurand]

We discussed this issue in a recent triage meeting and having a create command in web-ext is probably not worth the effort. There are already existing tools to bootstrap webextensions and a command in web-ext wouldn't be a better alternative, just another option like the ones already available. In the end, this is still code we have to maintain and clearly we cannot afford it at the moment.

[Pomax]

Can you name some of those tools (ideally with some links) so that future folks finding this issue through a web search know where to look further? Because I don't know any =/