From e4f0611ac52b581fe80e75e2fa4536b3788ec3f5 Mon Sep 17 00:00:00 2001
From: Daniel <danilacasito8@gmail.com>
Date: Tue, 26 May 2026 13:31:07 +0200
Subject: [PATCH] refactor: replace parseInt with Number.parseInt for
 consistency and clarity fix: add hidden input to card data labels for
 improved accessibility refactor: add scope attributes to table headers for
 better semantic structure

---
 tienda/templates/tienda/add_review.html      |  6 ++--
 tienda/templates/tienda/agregar_tarjeta.html |  2 +-
 tienda/templates/tienda/base.html            |  4 +--
 tienda/templates/tienda/checkout.html        | 30 ++++++++++----------
 4 files changed, 21 insertions(+), 21 deletions(-)

diff --git a/tienda/templates/tienda/add_review.html b/tienda/templates/tienda/add_review.html
index 0ebadc7..a20b57e 100644
--- a/tienda/templates/tienda/add_review.html
+++ b/tienda/templates/tienda/add_review.html
@@ -86,12 +86,12 @@ document.addEventListener('DOMContentLoaded', function() {
 
     stars.forEach(star => {
         star.addEventListener('click', function() {
-            const value = parseInt(this.dataset.value);
+            const value = Number.parseInt(this.dataset.value);
             updateStars(value);
         });
 
         star.addEventListener('mouseenter', function() {
-            const value = parseInt(this.dataset.value);
+            const value = Number.parseInt(this.dataset.value);
             stars.forEach((s, index) => {
                 if (index < value) {
                     s.classList.remove('text-secondary');
@@ -101,7 +101,7 @@ document.addEventListener('DOMContentLoaded', function() {
         });
 
         star.addEventListener('mouseleave', function() {
-            updateStars(parseInt(ratingInput.value) || 1);
+            updateStars(Number.parseInt(ratingInput.value) || 1);
         });
     });
 });
diff --git a/tienda/templates/tienda/agregar_tarjeta.html b/tienda/templates/tienda/agregar_tarjeta.html
index 6f80e03..667417a 100644
--- a/tienda/templates/tienda/agregar_tarjeta.html
+++ b/tienda/templates/tienda/agregar_tarjeta.html
@@ -44,7 +44,7 @@
                 </p>
 
                 <div class="mb-3">
-                    <label id="label-card-data" class="form-label">Datos de la tarjeta</label>
+                    <label id="label-card-data" class="form-label">Datos de la tarjeta <input type="hidden"></label>
                     <div id="card-element" aria-labelledby="label-card-data"></div>
                     <div id="card-errors" role="alert"></div>
                 </div>
diff --git a/tienda/templates/tienda/base.html b/tienda/templates/tienda/base.html
index a1e7a3c..2734ec4 100644
--- a/tienda/templates/tienda/base.html
+++ b/tienda/templates/tienda/base.html
@@ -106,8 +106,8 @@
                 <!-- Barra de búsqueda con sugerencias -->
                 <form class="search-suggestions-container" method="GET" action="{% url 'search' %}" role="search" id="searchForm">
                     <div class="input-group">
-                        <input class="form-control" type="search" name="q" id="searchInput" placeholder="Buscar productos..." aria-label="Buscar" autocomplete="off" role="combobox" aria-expanded="false" aria-autocomplete="list" aria-controls="searchSuggestions" aria-activedescendant="" aria-haspopup="listbox">
-                        <button class="btn btn-outline-primary" type="submit" aria-label="Buscar productos">🔍 Buscar</button>
+                        <input class="form-control" type="search" name="q" id="searchInput" placeholder="Buscar productos..." aria-label="Buscar" autocomplete="off" role="combobox" aria-expanded="false" aria-autocomplete="list" aria-controls="searchSuggestions" aria-activedescendant="searchbutton" aria-haspopup="listbox">
+                        <button class="btn btn-outline-primary" type="submit" id="searchbutton" aria-label="Buscar productos">🔍 Buscar</button>
                     </div>
                     <div class="search-suggestions" id="searchSuggestions" role="listbox" aria-label="Sugerencias de búsqueda"></div>
                 </form>
diff --git a/tienda/templates/tienda/checkout.html b/tienda/templates/tienda/checkout.html
index bdb81de..d295cc4 100644
--- a/tienda/templates/tienda/checkout.html
+++ b/tienda/templates/tienda/checkout.html
@@ -84,11 +84,11 @@
             <table class="table table-striped align-middle">
                 <thead>
                     <tr>
-                        <th>Producto</th>
-                        <th class="text-end">Precio (sin IVA)</th>
-                        <th class="text-end">Cantidad</th>
-                        <th class="text-end">Stock actual</th>
-                        <th class="text-end">Subtotal (con IVA)</th>
+                        <th scope="col">Producto</th>
+                        <th scope="col" class="text-end">Precio (sin IVA)</th>
+                        <th scope="col" class="text-end">Cantidad</th>
+                        <th scope="col" class="text-end">Stock actual</th>
+                        <th scope="col" class="text-end">Subtotal (con IVA)</th>
                     </tr>
                 </thead>
                 <tbody>
@@ -104,16 +104,16 @@
                 </tbody>
                 <tfoot>
                     <tr>
-                        <th colspan="4" class="text-end">Subtotal:</th>
-                        <th class="text-end">{{ cart.get_total|format_price }}€</th>
+                        <th colspan="4" scope="row" class="text-end">Subtotal:</th>
+                        <td class="text-end">{{ cart.get_total|format_price }}€</th>
                     </tr>
                     <tr>
-                        <th colspan="4" class="text-end">IVA (21%):</th>
-                        <th class="text-end text-success">+{{ cart.get_vat_amount|format_price }}€</th>
+                        <th scope="row" colspan="4" class="text-end">IVA (21%):</th>
+                        <td class="text-end text-success">+{{ cart.get_vat_amount|format_price }}€</th>
                     </tr>
                     <tr style="background-color: #f8f9fa;">
-                        <th colspan="4" class="text-end" style="font-size: 1.1rem;">Total:</th>
-                        <th class="text-end" style="font-size: 1.1rem;">{{ cart.get_total_with_vat|format_price }}€</th>
+                        <th scope="row" colspan="4" class="text-end" style="font-size: 1.1rem;">Total:</th>
+                        <td class="text-end" style="font-size: 1.1rem;">{{ cart.get_total_with_vat|format_price }}€</th>
                     </tr>
                 </tfoot>
             </table>
@@ -125,7 +125,7 @@
                 <h5 class="card-title mb-3">2) Selecciona tu método de pago</h5>
 
                 <!-- Tabs -->
-                <ul class="nav nav-tabs mb-3" id="paymentTabs" role="tablist">
+                <ul class="nav nav-tabs mb-3" id="paymentTabs">
                     <li class="nav-item" role="presentation">
                         <button class="nav-link active" id="tab-card" data-tab="pane-card" type="button"
                                 role="tab" aria-selected="true" aria-controls="pane-card" tabindex="0">
@@ -142,7 +142,7 @@
 
                 <!-- Tarjeta tab -->
                 <div id="pane-card" class="payment-tab-content active"
-                     role="tabpanel" aria-labelledby="tab-card" tabindex="0">
+                     role="tabpanel" aria-labelledby="tab-card">
                     {% if saved_cards %}
                     <fieldset class="mb-3">
                         <legend class="fw-semibold fs-6 mb-2">Selección de tarjeta</legend>
@@ -164,7 +164,7 @@
 
                     <div id="new-card-section" {% if saved_cards %}style="display:none;"{% endif %}>
                         <div class="mb-3">
-                            <label id="label-card-number" class="form-label">Número de tarjeta</label>
+                            <label id="label-card-number" class="form-label">Número de tarjeta <input type="hidden"></label>
                             <div id="card-element" aria-labelledby="label-card-number"></div>
                             <div id="card-errors" role="alert"></div>
                         </div>
@@ -187,7 +187,7 @@
 
                 <!-- PayPal tab -->
                 <div id="pane-paypal" class="payment-tab-content"
-                     role="tabpanel" aria-labelledby="tab-paypal" tabindex="0">
+                     role="tabpanel" aria-labelledby="tab-paypal">
                     {% if saved_paypal %}
                     <div class="alert alert-light border mb-3">
                         <small class="text-muted">Cuenta PayPal guardada:</small>