fix(ivy): reset style property value defined using [style.prop.px] (#33780)

Prior to this change, setting style prop value to undefined or empty string would not result in resetting prop value in case the style prop is defined using [style.prop.px] syntax. The problem is that the check for empty value (and thus reseting the value) considered successful only in case of `null` value. This commit updates the check to use `isStylingValueDefined` function that also checks for undefined and empty string.

PR Close #33780

packages/core/src/render3/instructions/styling.ts

@@ -585,7 +585,7 @@ function resolveStylePropValue(
   if (value === NO_CHANGE) return value;
 
   let resolvedValue: string|null = null;
-  if (value !== null) {
+  if (isStylingValueDefined(value)) {
     if (suffix) {
       // when a suffix is applied then it will bypass
       // sanitization entirely (b/c a new string is created)

packages/core/test/acceptance/styling_spec.ts

@@ -2310,6 +2310,34 @@ describe('styling', () => {
     expect(fixture.debugElement.nativeElement.innerHTML).toContain('three');
   });
 
+  it('should allow to reset style property value defined using [style.prop.px] binding', () => {
+    @Component({
+      template: '<div [style.left.px]="left"></div>',
+    })
+    class MyComp {
+      left = '';
+    }
+
+    TestBed.configureTestingModule({declarations: [MyComp]});
+    const fixture = TestBed.createComponent(MyComp);
+    fixture.detectChanges();
+
+    const checks = [
+      ['15', '15px'],
+      [undefined, ''],
+      [null, ''],
+      ['', ''],
+      ['0', '0px'],
+    ];
+    const div = fixture.nativeElement.querySelector('div');
+    checks.forEach((check: any[]) => {
+      const [fieldValue, expectedValue] = check;
+      fixture.componentInstance.left = fieldValue;
+      fixture.detectChanges();
+      expect(div.style.left).toBe(expectedValue);
+    });
+  });
+
   onlyInIvy('only ivy treats [class] in concert with other class bindings')
       .it('should retain classes added externally', () => {
         @Component({template: `<div [class]="exp"></div>`})