Test making button clickable

src/registrar/assets/src/js/getgov-admin/button-utils.js

@@ -0,0 +1,16 @@
+/**
+ * Initializes buttons to behave like links by navigating to their data-url attribute
+ * Example usage: <button class="use-button-as-link" data-url="/some/path">Click me</button>
+ */
+export function initButtonLinks() {
+    document.querySelectorAll('button.use-button-as-link').forEach(button => {
+        button.addEventListener('click', function() {
+            // Equivalent to button.getAttribute("data-href")
+            const href = this.dataset.href;
+            console.log(`in loop: ${href}`)
+            if (href) {
+                window.location.href = href;
+            }
+        });
+    });
+}

src/registrar/assets/src/js/getgov-admin/main.js

@@ -16,6 +16,7 @@ import { initDynamicPortfolioFields } from './portfolio-form.js';
 import { initDynamicDomainInformationFields } from './domain-information-form.js';
 import { initDynamicDomainFields } from './domain-form.js';
 import { initAnalyticsDashboard } from './analytics.js';
+import { initButtonLinks } from './button-utils.js';
 
 // General
 initModals();
@@ -23,6 +24,7 @@ initCopyToClipboard();
 initFilterHorizontalWidget();
 initDescriptions();
 initSubmitBar();
+initButtonLinks();
 
 // Domain request
 initIneligibleModal();

src/registrar/templates/admin/import_export/change_list_export_item.html

@@ -0,0 +1,7 @@
+{% load i18n %}
+{% load admin_urls %}
+
+{% if has_export_permission %}
+{% comment %} Uses the initButtonLinks {% endcomment %}
+<li><button class="export_link use-button-as-link" data-href="{% url opts|admin_urlname:"export" %}">{% trans "Export" %}</button></li>
+{% endif %}

src/registrar/templates/admin/import_export/change_list_import_item.html

@@ -3,6 +3,6 @@
 
 {% if has_import_permission %}
   {% if not IS_PRODUCTION %}
-<li><a href='{% url opts|admin_urlname:"import" %}' class="import_link">{% trans "Import" %}</a></li>
+<li><button class="import_link use-button-as-link" data-href="{% url opts|admin_urlname:"import" %}">{% trans "Import" %}</button></li>
   {% endif %}
 {% endif %}