refactor: change how plugin is initialized

BREAKING CHANGE: plugin initialization code changed:
```js
import { createFluentVue } from 'fluent-vue'

const fluent = createFluentVue({
  locale: 'en',
  bundles: bundles
})

Vue.use(fluent)
```

packages/fluent-vue/__tests__/changeLanguage.spec.ts

@@ -4,7 +4,7 @@ import { createLocalVue, mount } from '@vue/test-utils'
 import { FluentBundle, FluentResource } from '@fluent/bundle'
 import ftl from '@fluent/dedent'
 
-import FluentVue from '../src'
+import { createFluentVue } from '../src'
 
 describe('language change', () => {
   let options: any
@@ -13,18 +13,18 @@ describe('language change', () => {
 
   beforeEach(() => {
     const localVue = createLocalVue()
-    localVue.use(FluentVue)
 
     bundleEn = new FluentBundle('en-US')
     bundleUk = new FluentBundle('uk-UA')
 
-    const fluent = new FluentVue({
+    const fluent = createFluentVue({
       locale: ['uk-UA', 'en-US'],
       bundles: [bundleUk, bundleEn],
     })
 
+    localVue.use(fluent)
+
     options = {
-      fluent,
       localVue,
     }
   })
@@ -76,15 +76,15 @@ describe('language change', () => {
   it('updates when changing current locale', async () => {
     // Arrange
     const localVue = createLocalVue()
-    localVue.use(FluentVue)
 
     bundleEn = new FluentBundle('en-US')
     bundleUk = new FluentBundle('uk-UA')
 
-    const fluent = new FluentVue({
+    const fluent = createFluentVue({
       locale: 'uk-UA',
       bundles: [bundleUk, bundleEn],
     })
+    localVue.use(fluent)
 
     bundleEn.addResource(
       new FluentResource(ftl`
@@ -102,19 +102,77 @@ describe('language change', () => {
       template: `<a v-t:link href="/foo">Fallback text</a>`,
     }
 
+    // Act
+    const mounted = mount(component, { localVue })
+
+    expect(mounted.html()).toEqual(`<a href="/foo">текст посилання</a>`)
+
+    fluent.locale = 'en'
+
+    await Vue.nextTick()
+
+    // Assert
+    expect(mounted.html()).toEqual(`<a href="/foo">link text</a>`)
+  })
+
+  it('updates child components with overrides', async () => {
+    // Arrange
+    const localVue = createLocalVue()
+
+    bundleEn = new FluentBundle('en-US')
+    bundleUk = new FluentBundle('uk-UA')
+
+    const fluent = createFluentVue({
+      locale: 'uk-UA',
+      bundles: [bundleUk, bundleEn],
+    })
+    localVue.use(fluent)
+
+    bundleEn.addResource(
+      new FluentResource(ftl`
+      link = link text
+      `)
+    )
+
+    bundleUk.addResource(
+      new FluentResource(ftl`
+      link = текст посилання
+      `)
+    )
+
+    const child = {
+      template: `<span>{{ $t('child') }}</span>`,
+      __fluent: {
+        'uk-UA': new FluentResource(ftl`
+        child = Повідомлення
+        `),
+        'en-US': new FluentResource(ftl`
+        child = Child message
+        `),
+      },
+    }
+    const component = {
+      components: {
+        child,
+      },
+      template: `<div><span>{{ $t('link') }}</span><child /></div>`,
+    }
+
     // Act
     const mounted = mount(component, {
       fluent,
       localVue,
     })
 
-    expect(mounted.html()).toEqual(`<a href="/foo">текст посилання</a>`)
+    expect(mounted.html()).toEqual(
+      `<div><span>текст посилання</span><span>Повідомлення</span></div>`
+    )
 
     fluent.locale = 'en'
 
     await Vue.nextTick()
 
     // Assert
-    expect(mounted.html()).toEqual(`<a href="/foo">link text</a>`)
+    expect(mounted.html()).toEqual(`<div><span>link text</span><span>Child message</span></div>`)
   })
 })

packages/fluent-vue/__tests__/errorHandling.spec.ts

@@ -3,11 +3,10 @@ import { createLocalVue, mount } from '@vue/test-utils'
 import { FluentBundle, FluentResource } from '@fluent/bundle'
 import ftl from '@fluent/dedent'
 
-import FluentVue from '../src'
+import { createFluentVue } from '../src'
 
 describe('vue integration', () => {
   const localVue = createLocalVue()
-  localVue.use(FluentVue)
 
   const bundle = new FluentBundle('en-US')
 
@@ -18,13 +17,13 @@ describe('vue integration', () => {
   `)
   )
 
-  const fluent = new FluentVue({
+  const fluent = createFluentVue({
     locale: 'en-US',
     bundles: [bundle],
   })
+  localVue.use(fluent)
 
   const options = {
-    fluent,
     localVue,
   }
 

packages/fluent-vue/__tests__/fluent-bundle/inherit.spec.ts → packages/fluent-vue/__tests__/inheritBundle.spec.ts

@@ -1,8 +1,9 @@
-import { inheritBundle } from '../../src/fluent-bundle/inherit'
 import { FluentBundle, FluentResource } from '@fluent/bundle'
 import ftl from '@fluent/dedent'
 import { Pattern } from '@fluent/bundle/esm/ast'
 
+import { inheritBundle } from '../src/inheritBundle'
+
 describe('inheritBundle', () => {
   it('gets options from parent', () => {
     // Arrange

packages/fluent-vue/__tests__/vue/component.spec.ts

@@ -3,25 +3,24 @@ import { createLocalVue, mount } from '@vue/test-utils'
 import { FluentBundle, FluentResource } from '@fluent/bundle'
 import ftl from '@fluent/dedent'
 
-import FluentVue from '../../src'
+import { createFluentVue } from '../../src'
 
 describe('component', () => {
   let options: any
   let bundle: FluentBundle
 
   beforeEach(() => {
     const localVue = createLocalVue()
-    localVue.use(FluentVue)
 
     bundle = new FluentBundle('en-US')
 
-    const fluent = new FluentVue({
+    const fluent = createFluentVue({
       locale: 'en-US',
       bundles: [bundle],
     })
+    localVue.use(fluent)
 
     options = {
-      fluent,
       localVue,
     }
   })

packages/fluent-vue/__tests__/vue/customComponents.spec.ts

@@ -3,25 +3,24 @@ import { createLocalVue, mount } from '@vue/test-utils'
 import { FluentBundle, FluentResource } from '@fluent/bundle'
 import ftl from '@fluent/dedent'
 
-import FluentVue from '../../src'
+import { createFluentVue } from '../../src'
 
 describe('method', () => {
   let options: any
   let bundle: FluentBundle
 
   beforeEach(() => {
     const localVue = createLocalVue()
-    localVue.use(FluentVue)
 
     bundle = new FluentBundle('en-US')
 
-    const fluent = new FluentVue({
+    const fluent = createFluentVue({
       locale: 'en-US',
       bundles: [bundle],
     })
+    localVue.use(fluent)
 
     options = {
-      fluent,
       localVue,
     }
   })

packages/fluent-vue/__tests__/vue/directive.spec.ts

@@ -4,25 +4,24 @@ import { createLocalVue, mount } from '@vue/test-utils'
 import { FluentBundle, FluentResource } from '@fluent/bundle'
 import ftl from '@fluent/dedent'
 
-import FluentVue from '../../src'
+import { createFluentVue } from '../../src'
 
 describe('directive', () => {
   let options: any
   let bundle: FluentBundle
 
   beforeEach(() => {
     const localVue = createLocalVue()
-    localVue.use(FluentVue)
 
     bundle = new FluentBundle('en-US')
 
-    const fluent = new FluentVue({
+    const fluent = createFluentVue({
       locale: 'en-US',
       bundles: [bundle],
     })
+    localVue.use(fluent)
 
     options = {
-      fluent,
       localVue,
     }
   })

packages/fluent-vue/__tests__/vue/messageOverride.spec.ts

@@ -3,27 +3,28 @@ import { createLocalVue, mount } from '@vue/test-utils'
 import { FluentBundle, FluentResource } from '@fluent/bundle'
 import ftl from '@fluent/dedent'
 
-import FluentVue from '../../src'
+import { createFluentVue } from '../../src'
+import { FluentVue } from '../../src/interfaces'
 
 describe('message override', () => {
   let options: any
+  let fluent: FluentVue
   let bundleEn: FluentBundle
   let bundleUk: FluentBundle
 
   beforeEach(() => {
     const localVue = createLocalVue()
-    localVue.use(FluentVue)
 
     bundleEn = new FluentBundle(['en', 'en-US'])
     bundleUk = new FluentBundle(['uk', 'uk-UA'])
 
-    const fluent = new FluentVue({
+    fluent = createFluentVue({
       locale: ['uk-UA', 'en'],
       bundles: [bundleUk, bundleEn],
     })
+    localVue.use(fluent)
 
     options = {
-      fluent,
       localVue,
     }
   })
@@ -55,7 +56,7 @@ describe('message override', () => {
     const mounted = mount(component, options)
     expect(mounted.html()).toEqual(`<a href="/foo">текст посилання</a>`)
 
-    options.fluent.locale = 'uk'
+    fluent.locale = 'uk'
 
     // Assert
     expect(mounted.html()).toEqual(`<a href="/foo">текст посилання</a>`)

packages/fluent-vue/__tests__/vue/plugin.spec.ts

@@ -3,11 +3,10 @@ import { createLocalVue, mount } from '@vue/test-utils'
 import { FluentBundle, FluentResource } from '@fluent/bundle'
 import ftl from '@fluent/dedent'
 
-import FluentVue from '../../src'
+import { createFluentVue } from '../../src'
 
 describe('vue integration', () => {
   const localVue = createLocalVue()
-  localVue.use(FluentVue)
 
   const bundle = new FluentBundle('en-US')
 
@@ -18,13 +17,13 @@ describe('vue integration', () => {
     `)
   )
 
-  const fluent = new FluentVue({
+  const fluent = createFluentVue({
     locale: 'en-US',
     bundles: [bundle],
   })
+  localVue.use(fluent)
 
   const options = {
-    fluent,
     localVue,
   }
 
@@ -130,25 +129,4 @@ describe('vue integration', () => {
       expect(mounted.vm.$fluent).toBeUndefined()
     })
   })
-
-  it('does not try to clear if not initialized', () => {
-    // Arrange
-    const component = {
-      template: '<div>Just text</div>',
-    }
-
-    const mounted = mount(component, {
-      localVue,
-    })
-
-    // Act
-    mounted.destroy()
-
-    // Assert
-    expect(mounted.vm.$fluent).toBeUndefined()
-
-    localVue.nextTick(() => {
-      expect(mounted.vm.$fluent).toBeUndefined()
-    })
-  })
 })