#1702 Autocomplete data refresh and #1754 watcher

e2e/helpers/selectors.js

@@ -260,6 +260,7 @@ export default {
         submitItemTagsButton: `vn-item-tags ${components.vnSubmit}`
     },
     itemTax: {
+        undoChangesButton: 'vn-item-tax vn-button-bar > vn-button[label="Undo changes"]',
         firstClassAutocomplete: 'vn-item-tax vn-horizontal:nth-child(1) > vn-autocomplete[field="tax.taxClassFk"]',
         secondClassAutocomplete: 'vn-item-tax vn-horizontal:nth-child(2) > vn-autocomplete[field="tax.taxClassFk"]',
         thirdClassAutocomplete: 'vn-item-tax vn-horizontal:nth-child(3) > vn-autocomplete[field="tax.taxClassFk"]',

e2e/paths/04-item-module/03_tax.spec.js

@@ -1,8 +1,7 @@
 import selectors from '../../helpers/selectors.js';
 import createNightmare from '../../helpers/nightmare';
 
-// #1702 Autocomplete no siempre refresca al cancelar formulario
+describe('Item edit tax path', () => {
-xdescribe('Item edit tax path', () => {
     const nightmare = createNightmare();
 
     beforeAll(() => {
@@ -14,9 +13,9 @@ xdescribe('Item edit tax path', () => {
 
     it(`should add the item tax to all countries`, async() => {
         const result = await nightmare
-            .autocompleteSearch(selectors.itemTax.firstClassAutocomplete, 'Reduced VAT')
+            .autocompleteSearch(selectors.itemTax.firstClassAutocomplete, 'General VAT')
             .autocompleteSearch(selectors.itemTax.secondClassAutocomplete, 'General VAT')
-            .autocompleteSearch(selectors.itemTax.thirdClassAutocomplete, 'Reduced VAT')
+            .autocompleteSearch(selectors.itemTax.thirdClassAutocomplete, 'General VAT')
             .waitToClick(selectors.itemTax.submitTaxButton)
             .waitForLastSnackbar();
 
@@ -28,7 +27,7 @@ xdescribe('Item edit tax path', () => {
             .reloadSection('item.card.tax')
             .waitToGetProperty(`${selectors.itemTax.firstClassAutocomplete} input`, 'value');
 
-        expect(firstVatType).toEqual('Reduced VAT');
+        expect(firstVatType).toEqual('General VAT');
     });
 
     it(`should confirm the second item tax class was edited`, async() => {
@@ -42,6 +41,22 @@ xdescribe('Item edit tax path', () => {
         const thirdVatType = await nightmare
             .waitToGetProperty(`${selectors.itemTax.thirdClassAutocomplete} input`, 'value');
 
-        expect(thirdVatType).toEqual('Reduced VAT');
+        expect(thirdVatType).toEqual('General VAT');
+    });
+
+    it(`should edit the first class without saving the form`, async() => {
+        const firstVatType = await nightmare
+            .autocompleteSearch(selectors.itemTax.firstClassAutocomplete, 'Reduced VAT')
+            .waitToGetProperty(`${selectors.itemTax.firstClassAutocomplete} input`, 'value');
+
+        expect(firstVatType).toEqual('Reduced VAT');
+    });
+
+    it(`should now click the undo changes button and see the changes works`, async() => {
+        const firstVatType = await nightmare
+            .waitToClick(selectors.itemTax.undoChangesButton)
+            .waitToGetProperty(`${selectors.itemTax.firstClassAutocomplete} input`, 'value');
+
+        expect(firstVatType).toEqual('General VAT');
     });
 });

front/core/components/autocomplete/autocomplete.js

@@ -136,8 +136,8 @@ export default class Autocomplete extends Input {
             return;
 
         const selection = this.fetchSelection();
-        if (!this.selection)
+
-            this.selection = selection;
+        this.selection = selection;
     }
 
     fetchSelection() {

front/core/components/watcher/watcher.js

@@ -223,11 +223,8 @@ export default class Watcher extends Component {
     }
 
     loadOriginalData() {
-        Object.keys(this.data).forEach(key => {
+        const orgData = JSON.parse(JSON.stringify(this.orgData));
-            delete this.data[key];
+        this.data = Object.assign(this.data, orgData);
-        });
-
-        this.data = Object.assign(this.data, this.orgData);
         this.setPristine();
     }
 

modules/item/front/tax/index.html

@@ -1,5 +1,5 @@
 <vn-crud-model
-    url="/item/api/TaxClasses"
+    url="api/TaxClasses"
     fields="['id', 'description', 'code']"
     data="classes"
     auto-load="true">
@@ -11,7 +11,7 @@
 </vn-watcher>
 <form name="form" ng-submit="$ctrl.submit()" compact>
     <vn-card class="vn-pa-lg">
-        <vn-horizontal ng-repeat="tax in $ctrl.taxes track by $index">
+        <vn-horizontal ng-repeat="tax in $ctrl.taxes">
             <vn-textfield vn-one
                 label="Country"
                 model="tax.country.country"
@@ -21,7 +21,6 @@
                 label="Class"
                 field="tax.taxClassFk"
                 data="classes"
-                value-field="id"
                 show-field="description">
             </vn-autocomplete>
         </vn-horizontal>

modules/item/front/tax/index.js

@@ -1,11 +1,11 @@
 import ngModule from '../module';
 
 export default class Controller {
-    constructor($stateParams, $http, $translate, vnApp) {
+    constructor($stateParams, $http, $translate, $scope) {
+        this.$ = $scope;
         this.$http = $http;
         this.$stateParams = $stateParams;
         this._ = $translate;
-        this.vnApp = vnApp;
     }
 
     $onInit() {
@@ -21,9 +21,8 @@ export default class Controller {
             }]
         };
 
-        let urlFilter = encodeURIComponent(JSON.stringify(filter));
+        let url = `api/Items/${this.$stateParams.id}/taxes`;
-        let url = `/item/api/Items/${this.$stateParams.id}/taxes?filter=${urlFilter}`;
+        this.$http.get(url, {params: {filter}}).then(json => {
-        this.$http.get(url).then(json => {
             this.taxes = json.data;
         });
     }
@@ -33,14 +32,16 @@ export default class Controller {
         for (let tax of this.taxes)
             data.push({id: tax.id, taxClassFk: tax.taxClassFk});
 
-        let url = `/item/api/Items/updateTaxes`;
+        this.$.watcher.check();
-        this.$http.post(url, data).then(
+        let url = `api/Items/updateTaxes`;
-            () => this.vnApp.showSuccess(this._.instant('Data saved!'))
+        this.$http.post(url, data).then(() => {
-        );
+            this.$.watcher.notifySaved();
+            this.$.watcher.updateOriginalData();
+        });
     }
 }
 
-Controller.$inject = ['$stateParams', '$http', '$translate', 'vnApp'];
+Controller.$inject = ['$stateParams', '$http', '$translate', '$scope'];
 
 ngModule.component('vnItemTax', {
     template: require('./index.html'),

modules/item/front/tax/index.spec.js

@@ -2,65 +2,65 @@ import './index.js';
 
 describe('Item', () => {
     describe('Component vnItemTax', () => {
+        let $element;
         let $stateParams;
         let controller;
         let $httpBackend;
-        let vnApp;
 
         beforeEach(angular.mock.module('item', $translateProvider => {
             $translateProvider.translations('en', {});
         }));
 
-        beforeEach(angular.mock.inject(($componentController, _$httpBackend_, _$stateParams_, _vnApp_) => {
+        beforeEach(angular.mock.inject((_$httpBackend_, $rootScope, _$stateParams_, $compile) => {
             $stateParams = _$stateParams_;
             $stateParams.id = 1;
             $httpBackend = _$httpBackend_;
-            vnApp = _vnApp_;
+
-            spyOn(vnApp, 'showSuccess');
+            $httpBackend.whenGET(url => url.startsWith(`api/TaxClasses`))
-            controller = $componentController('vnItemTax', {$state: $stateParams});
+                .respond([
+                    {id: 1, description: 'Reduced VAT', code: 'R'},
+                    {id: 2, description: 'General VAT', code: 'G'}
+                ]);
+
+            $httpBackend.whenGET(url => url.startsWith(`api/Items/${$stateParams.id}/taxes`))
+                .respond([
+                    {id: 1, taxClassFk: 1}
+                ]);
+
+            $element = $compile(`<vn-item-tax></vn-item-tax`)($rootScope);
+            controller = $element.controller('vnItemTax');
         }));
 
+        afterEach(() => {
+            $element.remove();
+        });
+
         describe('getTaxes()', () => {
             it('should perform a query to set the array of taxes into the controller', () => {
-                let filter = {
-                    fields: ['id', 'countryFk', 'taxClassFk'],
-                    include: [{
-                        relation: 'country',
-                        scope: {fields: ['country']}
-                    }]
-                };
-                let response = [{id: 1, taxClassFk: 1}];
-                filter = encodeURIComponent(JSON.stringify(filter));
-                $httpBackend.when('GET', `/item/api/Items/1/taxes?filter=${filter}`).respond(response);
-                $httpBackend.expect('GET', `/item/api/Items/1/taxes?filter=${filter}`);
-                controller.$onInit();
                 $httpBackend.flush();
 
-                expect(controller.taxes).toEqual(response);
+                expect(controller.taxes[0].id).toEqual(1);
+                expect(controller.taxes[0].taxClassFk).toEqual(1);
             });
         });
 
         describe('submit()', () => {
             it('should perform a post to update taxes', () => {
-                let filter = {
+                spyOn(controller.$.watcher, 'notifySaved');
-                    fields: ['id', 'countryFk', 'taxClassFk'],
+                spyOn(controller.$.watcher, 'updateOriginalData');
-                    include: [{
+                controller.taxes = [
-                        relation: 'country',
+                    {id: 37, countryFk: 1, taxClassFk: 1, country: {id: 1, country: 'España'}}
-                        scope: {fields: ['country']}
+                ];
-                    }]
+                controller.$.watcher.data = [
-                };
+                    {id: 37, countryFk: 1, taxClassFk: 2, country: {id: 1, country: 'España'}}
-                let response = [{id: 1, taxClassFk: 1}];
+                ];
-                filter = encodeURIComponent(JSON.stringify(filter));
-                $httpBackend.when('GET', `/item/api/Items/1/taxes?filter=${filter}`).respond(response);
-                controller.$onInit();
-                $httpBackend.flush();
 
-                $httpBackend.when('POST', `/item/api/Items/updateTaxes`).respond('ok');
+                $httpBackend.whenPOST(`api/Items/updateTaxes`).respond('oki doki');
-                $httpBackend.expect('POST', `/item/api/Items/updateTaxes`);
                 controller.submit();
                 $httpBackend.flush();
 
-                expect(vnApp.showSuccess).toHaveBeenCalledWith('Data saved!');
+                expect(controller.$.watcher.notifySaved).toHaveBeenCalledWith();
+                expect(controller.$.watcher.updateOriginalData).toHaveBeenCalledWith();
             });
         });
     });