angular 2

I need someone to create super small/basic Angular 2 COMPONENT that will utilize probably Zone or NgZone in a way that only when everything is fetched from server and updated on page, the Protractor (testing framework) will get a signal that everything is stabilised and test can proceed. I need this to understand how to create components that will block protractor from continuing with tests when data is being requested from server. Elements on page: - DIV that should imitate loading state (should have ' *ngIf="!isDataReady" '); - DIV with text input and submit button inside (div should have ' *ngIf="isDataReady" '); Component: - ngOnInit() - should subscribe server response so that when it will come from server, component will fill in the input field and change isDataReady to true (create some delay on backend side) Protractor: - Test 1: 1. Go to Page 2. Get input value (this step should automaticly be executed only when Component fetched data and displayed input field - do not create waiting step for element to be visible here) 3. EXPECT - input's text should be the same as the one extracted by http request - Test 2: 1. Go to Page 2. Change input value (this step should automaticly be executed only when Component fetched data and displayed input field - do not create waiting step for element to be visible here) 3. Click Submit Button 4. Refresh the page (this step should be automaticly executed when input's data was sent to server and server response was received - in other words - when component was stabilised) 5. EXPECT - input's text should be the same as the one extracted by http response Additional info: - You can mock server response that the second test will recieve different value than the fist test (or you can implement backend normally with saving to database - whatever is faster) Current inplementation of ngOnInit(): ngOnInit() { [login to view URL](this.routerAdapter.$[login to view URL]).subscribe( (response:User) => { [login to view URL] = response; [login to view URL] = true; [login to view URL]([login to view URL]); [login to view URL](); } ) } Current implementation of onSubmit(): onSubmit() { [login to view URL]().subscribe( (newUser:User) => { [login to view URL](); [login to view URL]([login to view URL]); [login to view URL](); }, (err) => [login to view URL](err) ) }