fix for focustrap on dnssec modal

src/registrar/assets/src/js/getgov/domain-dnssec.js

@@ -0,0 +1,15 @@
+import { submitForm } from './helpers.js';
+
+export function initDomainDNSSEC() {
+    document.addEventListener('DOMContentLoaded', function() {
+        let domain_dnssec_page = document.getElementById("domain-dnssec");
+        if (domain_dnssec_page) {
+            const button = document.getElementById("disable-dnssec-button");
+            if (button) {
+                button.addEventListener("click", function () {
+                    submitForm("disable-dnssec-form");
+                });
+            }
+        }
+    });
+}

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

@@ -14,6 +14,7 @@ import { initPortfolioNewMemberPageToggle, initAddNewMemberPageListeners, initPo
 import { initDomainRequestForm } from './domain-request-form.js';
 import { initDomainManagersPage } from './domain-managers.js';
 import { initDomainDSData } from './domain-dsdata.js';
+import { initDomainDNSSEC } from './domain-dnssec.js';
 
 initDomainValidators();
 
@@ -42,6 +43,7 @@ initEditMemberDomainsTable();
 initDomainRequestForm();
 initDomainManagersPage();
 initDomainDSData();
+initDomainDNSSEC();
 
 // Init the portfolio new member page
 initPortfolioMemberPageRadio();

src/registrar/templates/domain_dnssec.html

@@ -27,7 +27,7 @@
   {% endif %}
   {% endblock breadcrumb %}
 
-  <h1>DNSSEC</h1>
+  <h1 id="domain-dnssec">DNSSEC</h1>
 
   <p>DNSSEC, or DNS Security Extensions, is an additional security layer to protect your website. Enabling DNSSEC ensures that when someone visits your domain, they can be certain that it’s connecting to the correct server, preventing potential hijacking or tampering with your domain's records.</p>
 
@@ -78,7 +78,11 @@
     aria-labelledby="Are you sure you want to continue?"
     aria-describedby="Your DNSSEC records will be deleted from the registry."
   >
-      {% include 'includes/modal.html' with modal_heading="Are you sure you want to disable DNSSEC?" modal_button=modal_button|safe %}
+      {% include 'includes/modal.html' with modal_heading="Are you sure you want to disable DNSSEC?" modal_button_id="disable_dnssec_button" modal_button_text="Confirm" modal_button_class="usa-button--secondary" %}
   </div>
+  <form method="post" id="disable_dnssec_form">
+    {% csrf_token %}
+    <input type="hidden" name="disable_dnssec" value="1">
+  </form>
 
 {% endblock %}  {# domain_content #}

src/registrar/views/domain.py

@@ -805,15 +805,6 @@ class DomainDNSSECView(DomainFormBaseView):
         context = super().get_context_data(**kwargs)
 
         has_dnssec_records = self.object.dnssecdata is not None
-
-        # Create HTML for the modal button
-        modal_button = (
-            '<button type="submit" '
-            'class="usa-button usa-button--secondary" '
-            'name="disable_dnssec">Confirm</button>'
-        )
-
-        context["modal_button"] = modal_button
         context["has_dnssec_records"] = has_dnssec_records
         context["dnssec_enabled"] = self.request.session.pop("dnssec_enabled", False)