bug #3031 [LiveComponent] Return empty string for data-value="" instead of falling back to null (mercuryseries)

This PR was squashed before being merged into the 2.x branch.

Discussion
----------

[LiveComponent] Return empty string for `data-value=""` instead of falling back to null

| Q             | A
| ------------- | ---
| Bug fix?      | yes
| New feature?  | no <!-- please update src/**/CHANGELOG.md files -->
| Docs?         | no <!-- required for new features -->
| Issues        | # <!-- prefix each issue number with "Fix #", no need to create an issue if none exist, explain below instead -->
| License       | MIT

## Problem

<details>
    <summary><b>Demo video</b></summary>

https://github.com/user-attachments/assets/31bba6af-8690-4cd9-a5c4-20a561342626
</details>

```html
<input type="text" data-model="post.title">
<button
    type="button"
    data-model="post.title"
    data-value="" <!-- HERE -->
    data-action="live#update"
>
    Clear Title
</button>
```

When using `data-value=""` on an element, the current implementation incorrectly returns `null` instead of the intended empty string value. This happens because the condition `if (element.dataset.value)` evaluates to `false` for empty strings (since empty strings are falsy in JavaScript), causing the function to fall through to the final `return null;` statement.

## Impact

This behavior prevents developers from explicitly setting empty string values via the `data-value` attribute, which is a common use case for clearing form fields or resetting values to empty states rather than `null`.

### Current behavior:

```html
<button data-model="title" data-value="" data-action="live#update">Clear</button>
<!-- Results in: null -->
```

### Expected behavior:

```html
<button data-model="title" data-value="" data-action="live#update">Clear</button>
<!-- Should result in: "" -->
```

<details>
    <summary><b>After (demo video)</b></summary>

https://github.com/user-attachments/assets/bad5f5f3-1104-4102-a2bc-30264bb3c5bf
</details>

## Changes

Replace the truthiness check `if (element.dataset.value)` with an explicit attribute existence check `if (element.hasAttribute("data-value"))`. This ensures that any `data-value` attribute, including those with empty string values, are properly processed and returned.

## Manual testing done
- ✅ `data-value=""` now returns `""`
- ✅ `data-value="test"` still returns `"test"`
- ✅ Missing `data-value` attribute still falls back to other value sources
- ✅ All existing functionality remains intact

Commits
-------

d0c0670 [LiveComponent] Return empty string for `data-value=""` instead of falling back to null

Author: Kocal

src/LiveComponent/assets/dist/live_controller.js

@@ -377,7 +377,7 @@ function getValueFromElement(element, valueStore) {
     }
     return element.value;
   }
-  if (element.dataset.value) {
+  if (element.hasAttribute("data-value")) {
     return element.dataset.value;
   }
   if ("value" in element) {

src/LiveComponent/assets/src/dom_utils.ts

@@ -51,7 +51,7 @@ export function getValueFromElement(element: HTMLElement, valueStore: ValueStore
     }
 
     // element is some other element
-    if (element.dataset.value) {
+    if (element.hasAttribute('data-value')) {
         return element.dataset.value;
     }
 

src/LiveComponent/assets/test/unit/dom_utils.test.ts

@@ -110,6 +110,40 @@ describe('getValueFromElement', () => {
 
         expect(getValueFromElement(div, createStore())).toEqual('the_value_from_attribute');
     });
+
+    it('Returns empty string for data-value=""', () => {
+        const btn = document.createElement('button');
+        // simulate the attribute explicitly present but empty
+        btn.dataset.value = '';
+        // also set a value on the button to ensure data-value takes precedence
+        btn.value = 'should_not_be_used';
+        expect(getValueFromElement(btn, createStore())).toBe('');
+    });
+
+    it('Returns "0" for data-value="0" (falsy but valid)', () => {
+        const el = document.createElement('div');
+        el.dataset.value = '0';
+        expect(getValueFromElement(el, createStore())).toBe('0');
+    });
+
+    it('Prefers data-value over value attribute when both are present', () => {
+        const el = document.createElement('div');
+        el.dataset.value = 'from_data_value';
+        el.setAttribute('value', 'from_value_attribute');
+        expect(getValueFromElement(el, createStore())).toBe('from_data_value');
+    });
+
+    it('Falls back to value attribute when data-value is absent', () => {
+        const el = document.createElement('div');
+        el.setAttribute('value', '');
+        // No data-value set
+        expect(getValueFromElement(el, createStore())).toBe('');
+    });
+
+    it('Returns null when neither data-value nor value attribute nor value property is present', () => {
+        const el = document.createElement('div');
+        expect(getValueFromElement(el, createStore())).toBe(null);
+    });
 });
 
 describe('setValueOnElement', () => {