zoukankan      html  css  js  c++  java
  • [Unit Testing] Angular Test component with required

    export default (ngModule) => {
        describe('Table Item component', () => {
    
            let $compile, directiveElem, directiveCtrl, $scope, state, parentElement;
    
            beforeEach(window.module(ngModule.name));
            beforeEach(inject(function (_$compile_, _$rootScope_, _$state_) {
                $compile = _$compile_;
                $scope = _$rootScope_.$new();
    
                state = _$state_;
                spyOn(state, 'go');
                spyOn(state, 'transitionTo');
    
                directiveElem = getCompiledElement();
                directiveCtrl = directiveElem.controller('ttmdTableItem');
            }));
    
            it('should have the controller defined', () => {
                expect(directiveCtrl).toBeDefined();
            });
    
            it('should have the parent controller defined', () => {
                expect(directiveCtrl.listCtrl).toBeDefined();
            });
    
            it('should include desktop item', () => {
                expect(directiveElem.find('ttmd-desktop-item').length).toEqual(1);
            });
    
            it('should include mobile item', () => {
                console.log(parentElement);
                directiveElem = getCompiledElement(true);
                directiveCtrl = directiveElem.controller('ttmdTableItem');
                $scope.$digest();
                expect(directiveElem.find('ttmd-mobile-item').length).toEqual(1);
            });
    
            function getCompiledElement(b) {
    
                $scope.item = {
                    "serviceCode": "1-655-834-8324",
                        "username": "Johann Homenick",
                        "amount": "4.37",
                        "dueDate": "2016-06-07T07:15:02.720Z"
                };
    
                $scope.headers = [
                    'id',
                    'number',
                    'username',
                    'amount',
                    'due date'
                ];
                const
                    mockParentController = {
                        goMobile() {
                            return b || false;
                        }
                    };
                    parentElement = angular.element('<div><ttmd-table-item item="item" headers="headers"><ttmd-actions></ttmd-table-item></div>');
                    parentElement.data('$ttmdTableController', mockParentController);
    
                const compiledDirective = $compile(parentElement)($scope)
                    .find('ttmd-table-item');
                $scope.$digest();
                return compiledDirective;
            }
        });
    };

    ------------------------

    Child:

    class TtmdTableItemController {
        constructor(ttMdTable) {
            this.ttMdTable = ttMdTable;
        }
    
        getSelectedItem(){
            return this.item;
        }
    }
    
    const ttmdTableItemComponent = {
        bindings: {
            item: '=',
            headers: '<',
            hasTransclude: '<'
        },
        transclude: true,
        replace: true,
        require: {
            'listCtrl': '^ttmdTable'
        },
        controller: TtmdTableItemController,
        controllerAs: 'vm',
        template: require('./table-item.html')
    };
    
    export default (ngModule) => {
        ngModule.component('ttmdTableItem', ttmdTableItemComponent);
    }

    parent:

    class TtmdTableController {
        constructor(PaginationModel, $transclude) {
    
               ....
        }
    
    
    
        goMobile() {
            return this.model.goMobile();
        }
    
    }
    
    const ttmdTableComponent = {
        bindings: {
           ...
        },
        transclude: {
            'actions': '?ttmdActions'
        },
        controller: TtmdTableController,
        controllerAs: 'vm',
        template: require('./ttmd-table.html')
    };
    
    export default (ngModule) => {
        ngModule.component('ttmdTable', ttmdTableComponent);
    }
  • 相关阅读:
    POJ 1469 COURSES 二分图最大匹配
    POJ 1325 Machine Schedule 二分图最大匹配
    USACO Humble Numbers DP?
    SGU 194 Reactor Cooling 带容量上下限制的网络流
    POJ 3084 Panic Room 求最小割
    ZOJ 2587 Unique Attack 判断最小割是否唯一
    Poj 1815 Friendship 枚举+求最小割
    POJ 3308 Paratroopers 最小点权覆盖 求最小割
    1227. Rally Championship
    Etaoin Shrdlu
  • 原文地址:https://www.cnblogs.com/Answer1215/p/5392042.html
Copyright © 2011-2022 走看看