Track CSS class name changes in bs5.

 - Legacy-Id: 19663

ietf/doc/templatetags/ballot_icon.py

@@ -109,7 +109,7 @@ def sort_key(t):
     else:
         typename = "IESG"
 
-    res = ['<a %s href="%s" data-toggle="modal" data-target="#modal-%d" title="%s positions (click to show more)" class="ballot-icon"><table' % (
+    res = ['<a %s href="%s" data-bs-toggle="modal" data-bs-target="#modal-%d" title="%s positions (click to show more)" class="ballot-icon"><table' % (
             right_click_string,
             urlreverse("ietf.doc.views_doc.ballot_popup", kwargs=dict(name=doc.name, ballot_id=ballot.pk)),
             ballot.pk,

ietf/meeting/tests_js.py

@@ -267,7 +267,7 @@ def test_edit_meeting_schedule(self):
         self.driver.find_element(By.CSS_SELECTOR, "#timeslot-toggle-modal-open").click()
         self.assertTrue(self.driver.find_element(By.CSS_SELECTOR, "#timeslot-group-toggles-modal").is_displayed())
         self.driver.find_element(By.CSS_SELECTOR, "#timeslot-group-toggles-modal [value=\"{}\"]".format("ts-group-{}-{}".format(slot2.time.strftime("%Y%m%d-%H%M"), int(slot2.duration.total_seconds() / 60)))).click()
-        self.driver.find_element(By.CSS_SELECTOR, "#timeslot-group-toggles-modal [data-dismiss=\"modal\"]").click()
+        self.driver.find_element(By.CSS_SELECTOR, "#timeslot-group-toggles-modal [data-bs-dismiss=\"modal\"]").click()
         self.assertTrue(not self.driver.find_element(By.CSS_SELECTOR, "#timeslot-group-toggles-modal").is_displayed())
 
         # swap days
@@ -1215,7 +1215,7 @@ def open_agenda_filter_ui(wait):
         """Click the 'customize' anchor to reveal the group buttons"""
         customize_anchor = wait.until(
             expected_conditions.element_to_be_clickable(
-                (By.CSS_SELECTOR, '#accordion a[data-toggle="collapse"]')
+                (By.CSS_SELECTOR, '#accordion a[data-bs-toggle="collapse"]')
             )
         )
         customize_anchor.click()
@@ -1390,7 +1390,7 @@ def test_agenda_view_group_filter_toggle_without_replace_state(self):
         # Click the 'customize' anchor to reveal the group buttons
         customize_anchor = WebDriverWait(self.driver, 2).until(
             expected_conditions.element_to_be_clickable(
-                (By.CSS_SELECTOR, '#accordion a[data-toggle="collapse"]')
+                (By.CSS_SELECTOR, '#accordion a[data-bs-toggle="collapse"]')
             )
         )
         customize_anchor.click()
@@ -1511,7 +1511,7 @@ def test_session_materials_modal(self):
         # Click the 'materials' button
         open_modal_button = WebDriverWait(self.driver, 2).until(
             expected_conditions.element_to_be_clickable(
-                (By.CSS_SELECTOR, '[data-target="#modal-%s"]' % slug)
+                (By.CSS_SELECTOR, '[data-bs-target="#modal-%s"]' % slug)
             ),
             'Modal open button not found or not clickable',
         )
@@ -1544,7 +1544,7 @@ def test_session_materials_modal(self):
         # Now close the modal
         close_modal_button = WebDriverWait(self.driver, 2).until(
             expected_conditions.element_to_be_clickable(
-                (By.CSS_SELECTOR, '.modal-footer button[data-dismiss="modal"]')
+                (By.CSS_SELECTOR, '.modal-footer button[data-bs-dismiss="modal"]')
             ),
             'Modal close button not found or not clickable',
         )
@@ -1564,7 +1564,7 @@ def test_session_materials_modal(self):
         # Click the 'materials' button
         open_modal_button = WebDriverWait(self.driver, 2).until(
             expected_conditions.element_to_be_clickable(
-                (By.CSS_SELECTOR, '[data-target="#modal-%s"]' % slug)
+                (By.CSS_SELECTOR, '[data-bs-target="#modal-%s"]' % slug)
             ),
             'Modal open button not found or not clickable for refresh test',
         )
@@ -2468,7 +2468,7 @@ def test_upcoming_materials_modal(self):
         # Click the 'materials' button
         open_modal_button = self.wait.until(
             expected_conditions.element_to_be_clickable(
-                (By.CSS_SELECTOR, '[data-target="#modal-%s"]' % slug)
+                (By.CSS_SELECTOR, '[data-bs-target="#modal-%s"]' % slug)
             ),
             'Modal open button not found or not clickable',
         )
@@ -2482,7 +2482,7 @@ def test_upcoming_materials_modal(self):
         close_modal_button = self.wait.until(
             presence_of_element_child_by_css_selector(
                 modal_div,
-                '.modal-footer button[data-dismiss="modal"]',
+                '.modal-footer button[data-bs-dismiss="modal"]',
             ),
             'Modal close button not found or not clickable',
         )
@@ -2621,7 +2621,7 @@ def do_delete_test(self, selector, keep, delete, cancel=False):
         if cancel:
             cancel_button = self.wait.until(
                 expected_conditions.element_to_be_clickable(
-                    (By.CSS_SELECTOR, '#delete-modal button[data-dismiss="modal"]')
+                    (By.CSS_SELECTOR, '#delete-modal button[data-bs-dismiss="modal"]')
                 ))
             cancel_button.click()
         else:

ietf/static/css/ietf.scss

@@ -37,7 +37,7 @@ $enable-negative-margins: true;
 @import "~/node_modules/bootstrap/scss/badge";
 @import "~/node_modules/bootstrap/scss/alert";
 // @import "~/node_modules/bootstrap/scss/progress";
-// @import "~/node_modules/bootstrap/scss/list-group";
+@import "~/node_modules/bootstrap/scss/list-group";
 @import "~/node_modules/bootstrap/scss/close";
 // @import "~/node_modules/bootstrap/scss/toasts";
 @import "~/node_modules/bootstrap/scss/modal";

ietf/static/js/agenda_timezone.js

@@ -48,9 +48,9 @@ window.format_time = function (t, tz, fmt) {
 
     switch (fmt) {
         case 0:
-            out = t.tz(tz).format('dddd, ') + '<span class="hidden-xs">' +
+            out = t.tz(tz).format('dddd, ') + '<span class="d-none d-sm-block">' +
                 t.tz(tz).format('MMMM Do YYYY, ') + '</span>' +
-                t.tz(tz).format('HH:mm') + '<span class="hidden-xs">' +
+                t.tz(tz).format('HH:mm') + '<span class="d-none d-sm-block">' +
                 t.tz(tz).format(' Z z') + '</span>';
             break;
         case 1:

ietf/static/js/ietf.js

@@ -9,7 +9,7 @@ import "bootstrap/js/dist/dropdown";
 import "bootstrap/js/dist/modal";
 // import "bootstrap/js/dist/offcanvas";
 // import "bootstrap/js/dist/popover";
-// import "bootstrap/js/dist/scrollspy";
+import "bootstrap/js/dist/scrollspy";
 import "bootstrap/js/dist/tab";
 // import "bootstrap/js/dist/toast";
 import "bootstrap/js/dist/tooltip";
@@ -39,6 +39,15 @@ jQuery.ajaxSetup({
     }
 });
 
+// Use the Bootstrap tooltip plugin for all elements with a title attribute
+$(document)
+    .ready(function () {
+        $('[title][title!=""]')
+            .not("th")
+            .attr("data-bs-toggle", "tooltip")
+            .tooltip();
+    });
+
 $(document)
     .ready(function () {
 

ietf/templates/api/index.html

@@ -2,7 +2,7 @@
 {% extends "base.html" %}
 {% load static %}
 {% block title %}API Notes{% endblock %}
-{% block bodyAttrs %}data-spy="scroll" data-target="#affix"{% endblock %}
+{% block bodyAttrs %}data-bs-spy="scroll" data-bs-target="#affix"{% endblock %}
 {% block content %}
 
     <h2>Datatracker API Notes</h2>
@@ -362,8 +362,8 @@ <h3 id="signing-keys" class="anchor-target">Signing Keys</h3>
 
     </div>
 
-    <div class="col-md-1 hidden-print bs-docs-sidebar" id="affix">
-        <ul class="nav nav-pills nav-stacked small fixed" data-spy="affix">
+    <div class="col-md-1 d-print-none bs-docs-sidebar" id="affix">
+        <ul class="nav nav-pills nav-stacked small fixed" data-bs-spy="affix">
 
             <li><a href="#framework">Framework API</a></li>
             <li><a href="#framework-documents">&nbsp; Framework API: Documents</a></li>

ietf/templates/base/menu_wg.html

@@ -4,7 +4,7 @@
 {% origin %}
 
 {% for p in parents %}
-    <li class="hidden-nojs dropend group-menu group-parent-{{ p.id }}">
+    <li class="dropend group-menu group-parent-{{ p.id }}">
         <a class="dropdown-item dropdown-toggle {% if flavor != 'top' %}text-wrap link-primary{% endif %}" href="{{ p.menu_url }}">
             {{ p.short_name }}
         </a>

ietf/templates/community/manage_list.html

@@ -105,7 +105,7 @@ <h2>Search rules</h2>
 
     {% endif %}
 
-    <div><a class="btn btn-primary" data-toggle="collapse" data-target="#add-new-rule">Add a new rule</a></div>
+    <div><a class="btn btn-primary" data-bs-toggle="collapse" data-bs-target="#add-new-rule">Add a new rule</a></div>
 
     <div id="add-new-rule" {% if not rule_type_form.errors and not rule_form %}class="collapse"{% endif %}>
         <h3>Add a new rule</h3>

ietf/templates/debug.html

@@ -36,13 +36,13 @@
                                 <td>
                                     {{ query.loc }}
                                     {% if query.origin %}
-                                        <button type="button" class="btn btn-primary btn-xs" data-toggle="modal" data-target="#modal-{{forloop.counter}}" >Origin</button>
+                                        <button type="button" class="btn btn-primary btn-xs" data-bs-toggle="modal" data-bs-target="#modal-{{forloop.counter}}" >Origin</button>
                                     {% endif %}
                                     <div class="modal fade" id="modal-{{forloop.counter}}" tabindex="-1" role="dialog" aria-labelledby="modal-title-{{forloop.counter}}">
                                         <div class="modal-dialog modal-max" role="document">
                                             <div class="modal-content">
                                                 <div class="modal-header">
-                                                    <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
+                                                    <button type="button" class="close" data-bs-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                                                     <h4 class="modal-title" id="modal-title-{{forloop.counter}}">QuerySet Origin for Query #{{forloop.counter}}</h4>
                                                 </div>
                                                 <div class="modal-body">
@@ -74,7 +74,7 @@ <h4 class="modal-title" id="modal-title-{{forloop.counter}}">QuerySet Origin for
                                                     </table>
                                                 </div>
                                                 <div class="modal-footer">
-                                                    <button type="button" class="btn btn-primary" data-dismiss="modal">Close</button>
+                                                    <button type="button" class="btn btn-primary" data-bs-dismiss="modal">Close</button>
                                                 </div>
                                             </div>
                                         </div>

ietf/templates/doc/ballot_popup.html

@@ -10,7 +10,7 @@
 
     <body>
         <div class="modal-header">
-            <button type="button" class="close" data-dismiss="modal">
+            <button type="button" class="close" data-bs-dismiss="modal">
                 <span aria-hidden="true">&times;</span>
                 <span class="sr-only">Close</span>
             </button>
@@ -42,7 +42,7 @@ <h4 class="modal-title" id="modal-title-{{ ballot_id }}">Ballot for {{ doc.name
                     {% endif %}
                 {% endif %}
             {% endif %}
-            <button type="button" class="btn btn-primary" data-dismiss="modal">Close</button>
+            <button type="button" class="btn btn-primary" data-bs-dismiss="modal">Close</button>
         </div>
     </body>
 </html>

ietf/templates/doc/document_ballot_content.html

@@ -3,7 +3,7 @@
 {% load textfilters %}
 
 <div class="row">
-    <div class="col-md-2 hidden-sm hidden-xs">
+    <div class="col-md-2 d-none d-md-block d-sm-block d-lg-block d-xl-block d-xxl-block">
 
         {% for n, positions in position_groups %}
             <h4><span class="badge bg-{{ n|pos_to_label }}"> {{ n.name }}</span></h4>

ietf/templates/doc/document_draft.html

@@ -217,11 +217,11 @@
                         <td class="edit"></td>
                         <td>
                             {% if check.errors or check.warnings %}
-                                <span class="checker-warning" data-toggle="modal" data-target="#check-{{check.pk}}" title="{{check.checker|title}} returned warnings or errors." >{{ check.symbol|safe }}</span>
+                                <span class="checker-warning" data-bs-toggle="modal" data-bs-target="#check-{{check.pk}}" title="{{check.checker|title}} returned warnings or errors." >{{ check.symbol|safe }}</span>
                             {% else %}
-                                <span class="checker-success" data-toggle="modal" data-target="#check-{{check.pk}}" title="{{check.checker|title}} passed">{{ check.symbol|safe }}</span>
+                                <span class="checker-success" data-bs-toggle="modal" data-bs-target="#check-{{check.pk}}" title="{{check.checker|title}} passed">{{ check.symbol|safe }}</span>
                             {% endif %}
-                            <a href="#" data-toggle="modal" data-target="#check-{{check.pk}}">
+                            <a href="#" data-bs-toggle="modal" data-bs-target="#check-{{check.pk}}">
                                 {{ check.errors }} errors, {{ check.warnings }} warnings.
                             </a>
                             {% include "doc/yang-check-modal-overlay.html" %}
@@ -683,7 +683,7 @@
         <a class="btn btn-primary btn-xs" href="{% url 'ietf.doc.views_doc.document_referenced_by' doc.canonical_name %}" rel="nofollow"><span class="bi bi-arrow-right"></span> Referenced by</a>
         <a class="btn btn-primary btn-xs" href="{{settings.IDNITS_BASE_URL}}?url=https://www.ietf.org/archive/id/{{ doc.filename_with_rev }}" rel="nofollow" target="_blank"><span class="bi bi-exclamation"></span> Nits</a>
         <div class="dropdown inline">
-            <button class="btn btn-primary btn-xs dropdown-toggle" type="button" id="ddSearchMenu" data-toggle="dropdown" aria-expanded="true">
+            <button class="btn btn-primary btn-xs dropdown-toggle" type="button" id="ddSearchMenu" data-bs-toggle="dropdown" aria-expanded="true">
                 <span class="bi bi-search"></span> Search lists <span class="caret"></span>
             </button>
             <ul class="dropdown-menu" role="menu">

ietf/templates/doc/document_history.html

@@ -71,7 +71,7 @@ <h2>Revision differences</h2>
                     <label class="control-label">Diff format</label>
                 </div>
                 <div class="col-sm-10">
-                    <div class="btn-group" data-toggle="buttons">
+                    <div class="btn-group" data-bs-toggle="buttons">
                         <label class="btn btn-primary active">
                             <input type="radio" name="difftype" value="--html"> Side-by-side
                         </label>

ietf/templates/doc/edit_telechat_date.html

@@ -18,7 +18,7 @@ <h1>Set telechat date<br><small>{{ doc.name }} ({{ doc.pages }} page{{ doc.pages
         {% csrf_token %}
         {% bootstrap_form form %}
 
-        <div id="large_page_count_warning" class="hidden-nojs alert alert-warning">
+        <div id="large_page_count_warning" class="alert alert-warning">
             Putting the document on this telechat gives the telechat a very large document page count. Please consider choosing another telechat date for this document.
         </div>
 
@@ -54,4 +54,4 @@ <h1>Set telechat date<br><small>{{ doc.name }} ({{ doc.pages }} page{{ doc.pages
             toggleWarning($(this).val());
         });
     </script>
-{% endblock %}
+{% endblock %}

ietf/templates/doc/search/search_result_row.html

@@ -88,9 +88,9 @@
     {% for check in doc.submission.latest_checks %}
       {% if check.passed != None and check.symbol.strip %}
 	{% if check.errors or check.warnings %}
-	   <span class="checker-warning float-end" data-toggle="modal" data-target="#check-{{check.pk}}" title="{{check.checker|title}} returned warnings or errors." >{{ check.symbol|safe }}</span>
+	   <span class="checker-warning float-end" data-bs-toggle="modal" data-bs-target="#check-{{check.pk}}" title="{{check.checker|title}} returned warnings or errors." >{{ check.symbol|safe }}</span>
 	{% else %}
-	   <span class="checker-success float-end" data-toggle="modal" data-target="#check-{{check.pk}}" title="{{check.checker|title}} passed">{{ check.symbol|safe }}</span>
+	   <span class="checker-success float-end" data-bs-toggle="modal" data-bs-target="#check-{{check.pk}}" title="{{check.checker|title}} passed">{{ check.symbol|safe }}</span>
 	{% endif %}
 	{% include "doc/yang-check-modal-overlay.html" %}
       {% endif %}

ietf/templates/doc/yang-check-modal-overlay.html

@@ -3,14 +3,14 @@
     <div class="modal-dialog modal-lg">
         <div class="modal-content">
             <div class="modal-header">
-                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
+                <button type="button" class="close" data-bs-dismiss="modal" aria-hidden="true">&times;</button>
                 <h4 class="modal-title" id="nitslabel">{{ check.checker|title }} for {{ doc.name }}-{{ doc.rev }} on {{ check.time|date:"Y-m-d" }}</h4>
             </div>
             <div class="modal-body">
                 <pre class="pasted">{{ check.message|zaptmp }}</pre>
             </div>
             <div class="modal-footer">
-                <button type="button" class="btn btn-primary" data-dismiss="modal">Close</button>
+                <button type="button" class="btn btn-primary" data-bs-dismiss="modal">Close</button>
             </div>
         </div>
     </div>

ietf/templates/group/active_wgs.html

@@ -8,7 +8,7 @@
 
 {% block title %}Active IETF working groups{% endblock %}
 
-{% block bodyAttrs %}data-spy="scroll" data-target="#affix"{% endblock %}
+{% block bodyAttrs %}data-bs-spy="scroll" data-bs-target="#affix"{% endblock %}
 
 {% block content %}
     {% origin %}
@@ -85,8 +85,8 @@ <h3>No active {{ area.acronym }} WGs</h3>
             {% endfor %}
 
         </div>
-        <div class="col-md-2 hidden-print bs-docs-sidebar" id="affix">
-            <ul class="nav nav-pills nav-stacked small" data-spy="affix">
+        <div class="col-md-2 d-print-none bs-docs-sidebar" id="affix">
+            <ul class="nav nav-pills nav-stacked small" data-bs-spy="affix">
                 {% for area in areas %}
                     <li><a href="#{{area.acronym}}">{{ area.name }}</a></li>
                 {% endfor %}

ietf/templates/group/all_photos.html

@@ -6,7 +6,7 @@
     .well { max-width: 150px;}
 {% endblock %}
 
-{% block bodyAttrs %}data-spy="scroll" data-target="#affix"{% endblock %}
+{% block bodyAttrs %}data-bs-spy="scroll" data-bs-target="#affix"{% endblock %}
 
 {% block title %}Chair Photos{% endblock %}
 
@@ -55,8 +55,8 @@ <h1>{{ group_type | upper }} {{ role }} Photos</h1>
         {% endfor %}
     </div>
 
-    <div class="col-md-1 hidden-print bs-docs-sidebar" id="affix">
-        <ul class="nav nav-pills nav-stacked small fixed" data-spy="affix">
+    <div class="col-md-1 d-print-none bs-docs-sidebar" id="affix">
+        <ul class="nav nav-pills nav-stacked small fixed" data-bs-spy="affix">
             {% for letter in alphabet_blocks %}
                 <li><a href="#{{letter.grouper}}">{{letter.grouper}}</a></li>
             {% endfor %}

ietf/templates/group/change_reviewer_settings.html

@@ -70,7 +70,7 @@ <h3>Unavailable periods</h3>
         <p>No periods found.</p>
     {% endif %}
 
-    <div><a class="btn btn-primary" data-toggle="collapse" data-target="#add-new-period">Add a new period</a></div>
+    <div><a class="btn btn-primary" data-bs-toggle="collapse" data-bs-target="#add-new-period">Add a new period</a></div>
 
     <div id="add-new-period" {% if not period_form.errors %}class="collapse"{% endif %}>
         <h4>Add a new period</h4>

ietf/templates/group/concluded_groups.html

@@ -18,7 +18,7 @@
 
 {% endblock %}
 
-{% block bodyAttrs %}data-spy="scroll" data-target="#navscroller"{% endblock %}
+{% block bodyAttrs %}data-bs-spy="scroll" data-bs-target="#navscroller"{% endblock %}
 
 {% block title %}Concluded groups{% endblock %}
 
@@ -92,7 +92,7 @@ <h1>Concluded groups</h1>
         {% endfor %}
     </div>
 
-    <div class="col-md-2 hidden-print bs-docs-sidebar" id="navscroller">
+    <div class="col-md-2 d-print-none bs-docs-sidebar" id="navscroller">
         <ul class="nav nav-pills nav-stacked small fixed" >
             {% for label, groups in sections.items %}
                 <li>