Automatically load script from Google about vue-recaptcha

[DanSnow]

Yeah, this have been requested before.
Because someone may need to custom the language of recaptcha, I thought that they have to load it by themself.

But for now, I have two proposal.

First one:

import Vue from 'vue'
import VueRecaptchaPlugin from 'vue-recaptcha'

Vue.use(VueRecpatchaPlugin, {
  lang: 'en', // Language can be configured here, it will append to the url params
  disableAutoload: true // Or completely disable auto load
})

This one may also register the vue-recaptcha component also.

I also imagine that maybe it will be possible to eliminate this feature as dead code when user only import VueRecaptcha component as named import.
Because I like to keep all the thing small when it need to pass through the network and load inside the browser.
But I don't someone else will care about maybe only a few bytes overhead.

Second one:

import Vue from 'vue'
import VueRecpatcha, { setAutoload } from 'vue-recaptcha'

setAutoload(false) // User can disable this functionality when they need to custom the url

new Vue({
  components: {VueRecpatcha} // And use the component like usual
})

Which one do you prefer? Also I'll mark this issue as help wanted and wait for some feedback.
Because both of them will be a breaking changed IMO.

[DanSnow]

About the language config, I think it shouldn't be a component's prop. Because it is only allow to config with url parameter. It will be a global config that share between all component until you refersh the page. If it is a component prop, someone may think that he/she can bind a data on it and change the language dynamically. It'll be confusing.
Although I can document this behavior. I think just make it be a immutable global option will be better.

[DanSnow]

@yariksav Current design will defer the loading until the first vue-recaptcha used. Using Vue.use is just for some global config like language.

[IlyaSemenov]

The first way for sure. Then to support the named import + custom script scenario, you can just add a new optional property so they will do <VueRecaptcha disable-autoload ...> (or: <VueRecaptcha lang="de" ...>.

Also, it doesn't have to be a breaking change. The autoload could be disabled by default (for now) to keep backward compatibility. (Although in the long run it makes sense to enable it by default.)

[benArambide]

I think that autoload and lang are ok in global config, because you can use the component int more than one place, even sitekey must be placed in the global config

[yariksav]

I suppose will be better to load google recaptcha libraries when component is created first time.
Because, loading in Vue.use(...) - means load libraries always when project started, even if recaptcha will not be used

[stale]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.

[stale]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.

[stale]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.