Merge branch '36460-metrics-dashboard-fails-to-load-script-doesn-t-stop' into 'master'

Remove update hook from date filter to prevent js from getting stuck

Closes #36460

See merge request gitlab-org/gitlab!20215

app/assets/javascripts/monitoring/components/date_time_picker/date_time_picker.vue

@@ -55,10 +55,12 @@ export default {
       };
     },
   },
-  mounted() {
-    this.verifyTimeRange();
+  watch: {
+    selectedTimeWindow() {
+      this.verifyTimeRange();
+    },
   },
-  updated() {
+  mounted() {
     this.verifyTimeRange();
   },
   methods: {

changelogs/unreleased/36460-metrics-dashboard-fails-to-load-script-doesn-t-stop.yml

+---
+title: Remove update hook from date filter to prevent js from getting stuck
+merge_request: 20215
+author:
+type: fixed

spec/frontend/monitoring/components/date_time_picker/date_time_picker_spec.js

@@ -51,6 +51,16 @@ describe('DateTimePicker', () => {
     });
   });
 
+  it('renders dropdown without a selectedTimeWindow set', done => {
+    createComponent({
+      selectedTimeWindow: {},
+    });
+    dateTimePicker.vm.$nextTick(() => {
+      expect(dateTimePicker.findAll('input').length).toBe(2);
+      done();
+    });
+  });
+
   it('renders inputs with h/m/s truncated if its all 0s', done => {
     createComponent({
       selectedTimeWindow: {