From 1e70a3db02f2c7f0964c066ee7067c95a292ed6d Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Javi=20Mart=C3=ADn?= <javim@elretirao.net>
Date: Fri, 14 Aug 2020 18:34:16 +0200
Subject: [PATCH] Disable phase date fields when a phase is disabled

The JavaScript involved wasn't working since we removed the disable-date
attribute in commit 73ff6881.

We're also improving the JavaScript in two ways:

First, we trigger the `change` event immediately, so when the page loads
date fields are disabled when phases are disabled.

And second, we don't remove the selected dates when disabling a phase,
so disabling it and enabling it again will keep the selected values.
---
 app/assets/javascripts/legislation_admin.js   | 14 +++----
 app/assets/stylesheets/layout.scss            |  4 ++
 .../admin/legislation/processes_spec.rb       | 38 +++++++++++++++++++
 3 files changed, 49 insertions(+), 7 deletions(-)

diff --git a/app/assets/javascripts/legislation_admin.js b/app/assets/javascripts/legislation_admin.js
index c4692014f..45d8723f4 100644
--- a/app/assets/javascripts/legislation_admin.js
+++ b/app/assets/javascripts/legislation_admin.js
@@ -2,21 +2,21 @@
   "use strict";
   App.LegislationAdmin = {
     initialize: function() {
-      $("input[type='checkbox'][data-disable-date]").on({
+      $(".legislation-process-form").find("[name$='enabled]'],[name$='[published]']").on({
         change: function() {
-          var checkbox, date_selector, parent;
+          var checkbox;
           checkbox = $(this);
-          parent = $(this).parents(".row:eq(0)");
-          date_selector = $(this).data("disable-date");
-          parent.find("input[type='text'][id^='" + date_selector + "']").each(function() {
+
+          checkbox.closest("fieldset").find("input[type='text']").each(function() {
             if (checkbox.is(":checked")) {
               $(this).removeAttr("disabled");
             } else {
-              $(this).val("");
+              $(this).prop("disabled", true);
             }
           });
         }
-      });
+      }).trigger("change");
+
       $("#nested_question_options").on("cocoon:after-insert", function() {
         App.Globalize.refresh_visible_translations();
       });
diff --git a/app/assets/stylesheets/layout.scss b/app/assets/stylesheets/layout.scss
index dabfb2330..c089d3b3d 100644
--- a/app/assets/stylesheets/layout.scss
+++ b/app/assets/stylesheets/layout.scss
@@ -1074,6 +1074,10 @@ form {
     &.error {
       margin-bottom: rem-calc(1);
     }
+
+    &:disabled {
+      background-color: $input-background-disabled;
+    }
   }
 
   [type="checkbox"] + label,
diff --git a/spec/system/admin/legislation/processes_spec.rb b/spec/system/admin/legislation/processes_spec.rb
index 822240489..1397f9feb 100644
--- a/spec/system/admin/legislation/processes_spec.rb
+++ b/spec/system/admin/legislation/processes_spec.rb
@@ -240,6 +240,44 @@ describe "Admin collaborative legislation" do
       expect(page).not_to have_content "Draft publication"
     end
 
+    scenario "Enabling/disabling a phase enables/disables its date fields", :js do
+      process.update!(published: false)
+
+      visit edit_admin_legislation_process_path(process)
+
+      expect(page).to have_field "start_date", disabled: true
+      expect(page).to have_field "end_date", disabled: true
+
+      check "legislation_process[published]"
+      fill_in "start_date", with: "07/07/2007"
+      fill_in "end_date", with: "08/08/2008"
+      uncheck "legislation_process[published]"
+
+      expect(page).to have_field "start_date", disabled: true
+      expect(page).to have_field "end_date", disabled: true
+
+      check "legislation_process[published]"
+
+      expect(page).to have_field "start_date", disabled: false, with: "07/07/2007"
+      expect(page).to have_field "end_date", disabled: false, with: "08/08/2008"
+    end
+
+    scenario "Enabling/disabling a phase does not enable/disable another phase date fields", :js do
+      process.update!(draft_phase_enabled: false, draft_publication_enabled: false)
+
+      visit edit_admin_legislation_process_path(process)
+
+      expect(page).to have_field "draft_start_date", disabled: true
+      expect(page).to have_field "draft_end_date", disabled: true
+      expect(page).to have_field "draft_publication_date", disabled: true
+
+      check "legislation_process[draft_phase_enabled]"
+
+      expect(page).to have_field "draft_start_date", disabled: false
+      expect(page).to have_field "draft_end_date", disabled: false
+      expect(page).to have_field "draft_publication_date", disabled: true
+    end
+
     scenario "Change proposal categories" do
       visit edit_admin_legislation_process_path(process)
       within(".admin-content") { click_link "Proposals" }