Angular Модульное тестирование для MatTable - PullRequest
Новая
       71

Angular Модульное тестирование для MatTable

0 голосов
/ 09 июля 2020

Я пытаюсь написать тест для mattable, используя шутку, но сталкиваюсь с какой-то проблемой, может ли кто-нибудь помочь решить, или некоторые могут предоставить пример для того же 

`let data =[{
id: "879879879798-dsf60-gfd2c963f66afa6",
amountToPay: 100.00
scheduledAt: new Date()
}];
let m =new  InstructionRequestListModel();
m.updateTableData(data);

let storeStub: Partial<InstructionStore> = {
store: {
    requestModel: new InstructionRequestModel(),
    requestListModel: m
}
};

describe('InstructionComponent', () => {
let fixture: ComponentFixture<InstructionComponent>;
let component: InstructionComponent;
let stubService: InstructionStore;


beforeEach(async(() => {
    const configure: ConfigureFn = testBed => {
        testBed.configureTestingModule({
            declarations: [InstructionComponent],
            imports: [HttpClientTestingModule, SharedModule, MatTableModule, BrowserAnimationsModule, RouterTestingModule, MatDialogModule],
            schemas: [NO_ERRORS_SCHEMA],
            providers: [{provide: InstructionStore, useValue: storeStub}
            ]
        })
    };

    configureTests(configure).then(testBed => {
        fixture = testBed.createComponent(InstructionComponent);
        component = fixture.componentInstance;
        component.store.store$ = Observable.of({
            requestModel: new InstructionRequestModel(),
            requestListModel: m
        })
        stubService = testBed.get(InstructionStore);
        
        fixture.detectChanges();
    });
}));

it('should create the app', (() => {
    const app = component;
    expect(app).toBeTruthy();
}));    

});

App -struction.ts 

@Component({
selector: 'app-instruction',
templateUrl: './instruction.component.html',
styleUrls: ['./instruction.component.scss']
})
export class InstructionComponent implements OnInit , AfterViewInit {
@ViewChild(MatPaginator, {static: true}) paginator: MatPaginator;
@ViewChild(MatSort, {static: true}) sort: MatSort;
@ViewChild('input', {static: false}) input: ElementRef;
@ViewChild(MatTable, {static: true}) table: MatTable<[]>;
@ViewChild(MatButtonToggleGroup, {static: true}) matButtonToggleGroup: MatButtonToggleGroup;

@Output() paginate: EventEmitter<InstructionRequestListModel> = new EventEmitter();

@Input() setSpinner: boolean;
@Input() providerView: boolean;

public dataModel: InstructionRequestListModel = new InstructionRequestListModel();

displayedColumns: string[] = ['instructionId','amountToPay', 'scheduledAt', 'Direction'];

public pageNumber = 0;

get apiPageNumber() {
    return this.uiPageNumber + 1;
}

constructor(public store: InstructionStore,
public commonStore: CommonStore) {
}

ngOnInit() {
    this.dataModel.updateDataModel('pageNumber', this.pageNumber);
    this.paginate.emit(this.dataModel);
}

ngAfterViewInit() {
    this.store.store$.subscribe((data: InstructionState) => {
        this.table.renderRows();
    });
    this.sort.sortChange.subscribe(() => {
        const sortOrder = `${this.sort.active} ${this.sort.direction}`;
        this.changeSort(sortOrder);
    });
 }
 }

InstructionStore.ts 

const initialState: InstructionState = {
requestModel: new sInstructionRequestModel(),
requestListModel: new InstructionRequestListModel(),
};

  @Injectable({
providedIn: 'root'
})
  export class InstructionStore {
get store(): InstructionState {
    return this._storeSubject.getValue();
}

set store(payload: InstructionState) {
    this._storeSubject.next(payload);
}
private readonly _storeSubject = new BehaviorSubject<InstructionState>(initialState);

store$ = this._storeSubject.asObservable();

async setInstructionState(state: InstructionState) {
    this.store = { ...state };
}

async setRequestModel(state: InstructionRequestModel) {
    this.store = { ...this.store, requestModel: state };
}

async setRequestListModel(state: InstructionRequestListModel) {
    this.store = { ...this.store, requestListModel: state };
}

}

InstructionListRequestsModel.ts 

interface InstructionListRequestsModel {

pageNumber?: number,
pageSize?: number,
sortBy?: InstructionSortBy,
order?: SortOrder,
observe?: 'body',
reportProgress?: boolean
}

export default class InstructionRequestListModel {
private dataModel: InstructionListRequestsModel;
private tableData: InstructionsResponse[] = [];
public totalRecords = 0;

constructor() {
    this.dataModel = {
        pageNumber: 1,
        pageSize: 25,       
        sortBy: InstructionSortBy.SCHEDULEDATE,
        order: SortOrder.ASCENDING
    };
}

get getModel() {
    return this.dataModel;
}

get getTableData() {
    return this.tableData;
}

public updateTableData = (data: any[]) => {
    this.tableData = data;
};

public updateDataModel = (propertyName: string, param: any) => {
    this.dataModel[propertyName] = param;
};
}

я получаю TypeError: невозможно прочитать свойство renderRows неопределенного для таблицы, как я могу инициализировать таблица comp onet

...