Fix events repeatableAdded/Removed not working when used in DOM template

src/FormulateGrouping.vue

@@ -121,10 +121,12 @@ export default {
         // In this context we actually have data
         this.context.model = this.context.model.filter((item, i) => i === index ? false : item)
         this.context.rootEmit('repeatableRemoved', this.context.model)
+        this.context.rootEmit('repeatable-removed', this.context.model)
       } else if (!Array.isArray(this.context.model) && this.items.length > this.context.minimum) {
         // In this context the fields have never been touched (not "dirty")
         this.context.model = (new Array(this.items.length - 1)).fill('').map((_i, idx) => this.setId({}, idx))
         this.context.rootEmit('repeatableRemoved', this.context.model)
+        this.context.rootEmit('repeatable-removed', this.context.model)
       }
       // Otherwise, do nothing, we're at our minimum
     },

src/inputs/FormulateInputGroup.vue

@@ -142,6 +142,7 @@ export default {
         this.context.model = (new Array(this.totalItems + 1)).fill('').map(() => setId({}))
       }
       this.context.rootEmit('repeatableAdded', this.context.model)
+      this.context.rootEmit('repeatable-added', this.context.model)
     },
     groupItemContext (context, option, groupAttributes) {
       const optionAttributes = { isGrouped: true }

test/unit/FormulateInputGroup.test.js

@@ -859,7 +859,8 @@ describe('FormulateInputGroup', () => {
         value: [{ username: 'mermaid', email: '[email protected]' }, { username: 'blah', email: '[email protected]' }],
       },
       listeners: {
-        'repeatableRemoved': removeListener
+        'repeatableRemoved': removeListener,
+        'repeatable-removed': removeListener
       },
       slots: {
         default: `
@@ -871,7 +872,7 @@ describe('FormulateInputGroup', () => {
     await flushPromises()
     wrapper.find('.formulate-input-group-repeatable-remove').trigger('click')
     await flushPromises()
-    expect(removeListener.mock.calls.length).toBe(1)
+    expect(removeListener.mock.calls.length).toBe(2)
   })
 
   it('allows passing errors down into groups', async () => {
@@ -884,7 +885,8 @@ describe('FormulateInputGroup', () => {
         value: [{}],
       },
       listeners: {
-        'repeatableAdded': addListener
+        'repeatableAdded': addListener,
+        'repeatable-added': addListener
       },
       slots: {
         default: `
@@ -896,7 +898,7 @@ describe('FormulateInputGroup', () => {
     await flushPromises()
     wrapper.find('.formulate-input-group-add-more button').trigger('click')
     await flushPromises()
-    expect(addListener.mock.calls.length).toBe(1)
+    expect(addListener.mock.calls.length).toBe(2)
   })
 
   it('ensures there are always a minimum number of items even if the model has fewer', async () => {