automate kebab-casing for attributes

README.md

@@ -196,11 +196,11 @@ Any kwargs passed to vite_react_refresh will be added to its generated `<script/
 By default, all script tags are generated with a `type="module"` and `crossorigin=""` attributes just like ViteJS do by default if you are building a single-page app.
 You can override this behavior by adding or overriding this attributes like so :
 
-```
-{% vite_asset '<path to your asset>' foo="bar" hello="world" %}
+```jinja-html
+{% vite_asset '<path to your asset>' foo="bar" hello="world" data_turbo_track="reload" %}
 ```
 
-This line will add `foo="bar"` and `hello="world"` attributes.
+This line will add `foo="bar"`, `hello="world"`, and `data-turbo-track="reload"` attributes.
 
 You can also use context variables to fill attributes values :
 
@@ -214,26 +214,6 @@ If you want to overrides default attributes just add them like new attributes :
 {% vite_asset '<path to your asset>' crossorigin="anonymous" %}
 ```
 
-Although it's recommended to keep the default `type="module"` attribute as ViteJS build scripts as ES6 modules.
-
-You can also set attributes that require `kebab-casing` by padding `json_encoded_attributes`.
-
-```python
-from django.utils.safestring import SafeString
-
-def your_view(request):
-  json_encoded_attributes = json.dumps({
-    "some-item": "3",
-    "some-other-item": "value",
-  })
-
-  render(request, template, context={ "json_encoded_attributes": SafeString(json_encoded_attributes) })
-```
-
-```html
-{% vite_asset '<path to your asset>' json_encoded_attributes=json_encoded_attributes %}
-```
-
 ## Vite Legacy Plugin
 
 If you want to consider legacy browsers that don't support ES6 modules loading

django_vite/core/asset_loader.py

@@ -301,11 +301,6 @@ def generate_vite_asset(
             str -- The <script> tag and all <link> tags to import
                 this asset in your page.
         """
-
-        json_encoded_attributes = kwargs.pop("json_encoded_attributes", "{}")
-        json_encoded_attributes = json.loads(json_encoded_attributes)
-        kwargs.update(json_encoded_attributes)
-
         if self.dev_mode:
             url = self._get_dev_server_url(path)
             return TagGenerator.script(

django_vite/core/tag_generator.py

@@ -8,7 +8,9 @@ def attrs_to_str(attrs: Dict[str, str]):
     Convert dictionary of attributes into a string that can be injected into a <script/>
     tag.
     """
-    attrs_str = " ".join([f'{key}="{value}"' for key, value in attrs.items()])
+    attrs_str = " ".join(
+        [f'{key.replace("_", "-")}="{value}"' for key, value in attrs.items()]
+    )
     return attrs_str
 
 

tests/tests/templatetags/test_vite_asset.py

@@ -212,21 +212,13 @@ def test_vite_asset_override_default_attribute():
 
 @pytest.mark.usefixtures("dev_mode_all")
 def test_vite_asset_kebab_attribute():
-    additional_attributes = {
-        "data-item-track": "reload",
-        "data-other": "3",
-    }
     template = Template(
         """
         {% load django_vite %}
-        {% vite_asset "src/entry.ts" json_encoded_attributes=json_encoded_attributes %}
+        {% vite_asset "src/entry.ts" data_item_track="reload" data_other="3" %}
     """
     )
-    html = template.render(
-        Context(
-            {"json_encoded_attributes": SafeString(json.dumps(additional_attributes))}
-        )
-    )
+    html = template.render(Context({}))
     soup = BeautifulSoup(html, "html.parser")
     script_tag = soup.find("script")
     assert script_tag["data-item-track"] == "reload"