null or undefined should skip grid lines in the time scale (#9252)

* `null` or `undefined` should skip grid lines in the time scale

* Refactor implementation per code review

src/core/core.scale.js

@@ -552,14 +552,6 @@ export default class Scale extends Element {
       tick = ticks[i];
       tick.label = call(tickOpts.callback, [tick.value, i, ticks], me);
     }
-    // Ticks should be skipped when callback returns null or undef, so lets remove those.
-    for (i = 0; i < ilen; i++) {
-      if (isNullOrUndef(ticks[i].label)) {
-        ticks.splice(i, 1);
-        ilen--;
-        i--;
-      }
-    }
   }
   afterTickToLabelConversion() {
     call(this.options.afterTickToLabelConversion, [this]);
@@ -769,6 +761,16 @@ export default class Scale extends Element {
 
     me.generateTickLabels(ticks);
 
+    // Ticks should be skipped when callback returns null or undef, so lets remove those.
+    let i, ilen;
+    for (i = 0, ilen = ticks.length; i < ilen; i++) {
+      if (isNullOrUndef(ticks[i].label)) {
+        ticks.splice(i, 1);
+        ilen--;
+        i--;
+      }
+    }
+
     me.afterTickToLabelConversion();
   }
 

test/fixtures/scale.time/skip-null-gridlines.js

@@ -0,0 +1,32 @@
+module.exports = {
+  threshold: 0.01,
+  tolerance: 0.0025,
+  config: {
+    type: 'line',
+    data: {
+      labels: ['2017', '2018', '2019', '2020', '2025'],
+      datasets: [{data: [0, 1, 2, 3, 4], fill: false}]
+    },
+    options: {
+      scales: {
+        x: {
+          type: 'time',
+          time: {
+            parser: 'YYYY',
+            unit: 'year'
+          },
+          ticks: {
+            source: 'auto',
+            callback: (tick, index) => index % 2 === 0 ? null : tick,
+          }
+        },
+        y: {
+          display: false
+        }
+      }
+    }
+  },
+  options: {
+    spriteText: true
+  }
+};

test/fixtures/scale.time/skip-undefined-gridlines.js

@@ -0,0 +1,32 @@
+module.exports = {
+  threshold: 0.01,
+  tolerance: 0.0025,
+  config: {
+    type: 'line',
+    data: {
+      labels: ['2017', '2018', '2019', '2020', '2025'],
+      datasets: [{data: [0, 1, 2, 3, 4], fill: false}]
+    },
+    options: {
+      scales: {
+        x: {
+          type: 'time',
+          time: {
+            parser: 'YYYY',
+            unit: 'year'
+          },
+          ticks: {
+            source: 'auto',
+            callback: (tick, index) => index % 2 === 0 ? undefined : tick,
+          }
+        },
+        y: {
+          display: false
+        }
+      }
+    }
+  },
+  options: {
+    spriteText: true
+  }
+};