manuallyHandleLifecycle() data in view-model not going to view
- Dominant language
- TypeScript
- Stars
- 11.7k
- Forks
- 608
- PR merge metrics
- No merged PRs in 30d
Description
**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:
`
`
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?**
Contributor guide
Research direction
Start at manuallyHandleLifecycle() and the shown lifecycle test sequence, then compare it with component.create(bootstrap as any), which the report says behaves correctly. Reproduce the failing assertion around span.innerHTML and determine whether the view update is complete after attached(); done means the reported sequence renders "some string" without a second bind().
Written by the indexing model from the issue text.
Assessment
- Tech stack
- typescript, webpack
- Domain
- frontend, testing
- Issue type
- Bug
- Difficulty
- 4/5
- Estimated time
- 3-5 days
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 25/100