#888·framework

manuallyHandleLifecycle() data in view-model not going to view

Author: yuananthonyCreated May 29, 2018Updated Jun 1, 2022

I'm submitting a bug report

  • Library Version: major.minor.patch-pre

Please tell us about your environment:

  • Operating System: OSX 10.13.4

  • Node Version: 6.9.5

  • NPM Version: 3.10.10
  • Aurelia CLI OR JSPM OR Webpack AND Version webpack 3.11.0
  • Browser: Chrome 66.0.3359.181

  • Language: TypeScript 2.8.3

Current behavior: When using manuallyHandleLifecycle() to manually call the lifecycle functions, the data in the view model is not being passed to the view.

view-model: @bindable({ defaultBindingMode: bindingMode.oneWay }) public inputString?: string;

public constructor() { this.inputString = void 0; }

public attached(): void { this.setInputString(); // Some function that sets the inputString }

public detached(): void { this.inputString = void 0; }

view: <template> <span innerHTML.bind="inputString"></span> </template>

test: await component.manuallyHandleLifecycle().create(bootstrap as any); await wait(1000); let nameElement = document.querySelectorAll('span'); await component.bind() await component.attached(); await wait(1000); expect(nameElement[0].innerHTML).toBe('some string'); await component.detached(); await component.unbind();

The test fails with the innerHTML being "undefined" and this happens even if setInputString() is removed and inputString is hard coded in the attached() function. The same outcome occurs when setInputString() is called in bind().

However, if await component.bind() is called again after await component.attached() the expected behavior occurs and test passes.

Expected/desired behavior: It is expected to set the variable in attached() and have that string represented in the view when calling lifecycle functions in manuallyHandleLifecycle();

I am unable to reproduce this error and it only happens in one of my test files that use manuallyHandleLifecycle() all other tests with this function works as expected.

This only happens in manuallyHandleLifecycle(), when testing the component using await component.create(bootstrap as any) the expected behavior occurs.

  • What is the motivation / use case for changing the behavior?