11900897355

Committed 18 Nov 2024 08:53PM UTC coverage: 83.198% (-0.5%) from 83.705%

Build # 11900897355

Build Type

push

github

Committed by

web-flow

Commit Message

fix: filter only one click after drag/pan is completed (#891)

Run Details

230 of 292 branches covered (78.77%)

Branch coverage included in aggregate %.

5 of 9 new or added lines in 3 files covered. (55.56%)

488 of 571 relevant lines covered (85.46%)

1381.62 hits per line

Source File
Press 'n' to go to next uncovered line, 'b' for previous

84.0

/src/plugin.js

import Hammer from 'hammerjs';
import {addListeners, computeDragRect, removeListeners} from './handlers';
import {hammerOptionsChanged, startHammer, stopHammer} from './hammer';
import {pan, zoom, resetZoom, zoomScale, getZoomLevel, getInitialScaleBounds, getZoomedScaleBounds, isZoomedOrPanned, isZoomingOrPanning, zoomRect} from './core';
import {panFunctions, zoomFunctions, zoomRectFunctions} from './scale.types';
import {getState, removeState} from './state';
import {version} from '../package.json';

function draw(chart, caller, options) {
  const dragOptions = options.zoom.drag;
  const {dragStart, dragEnd} = getState(chart);

  if (dragOptions.drawTime !== caller || !dragEnd) {
    return;
  }
  const {left, top, width, height} = computeDragRect(chart, options.zoom.mode, {dragStart, dragEnd}, dragOptions.maintainAspectRatio);
  const ctx = chart.ctx;

  ctx.save();
  ctx.beginPath();
  ctx.fillStyle = dragOptions.backgroundColor || 'rgba(225,225,225,0.3)';
  ctx.fillRect(left, top, width, height);

  if (dragOptions.borderWidth > 0) {
    ctx.lineWidth = dragOptions.borderWidth;
    ctx.strokeStyle = dragOptions.borderColor || 'rgba(225,225,225)';
    ctx.strokeRect(left, top, width, height);
  }
  ctx.restore();
}

export default {
  id: 'zoom',

  version,

  defaults: {
    pan: {
      enabled: false,
      mode: 'xy',
      threshold: 10,
      modifierKey: null,
    },
    zoom: {
      wheel: {
        enabled: false,
        speed: 0.1,
        modifierKey: null
      },
      drag: {
        enabled: false,
        drawTime: 'beforeDatasetsDraw',
        modifierKey: null
      },
      pinch: {
        enabled: false
      },
      mode: 'xy',
    }
  },

  start: function(chart, _args, options) {
    const state = getState(chart);
    state.options = options;

    if (Object.prototype.hasOwnProperty.call(options.zoom, 'enabled')) {
      console.warn('The option `zoom.enabled` is no longer supported. Please use `zoom.wheel.enabled`, `zoom.drag.enabled`, or `zoom.pinch.enabled`.');
    }
    if (Object.prototype.hasOwnProperty.call(options.zoom, 'overScaleMode')
      || Object.prototype.hasOwnProperty.call(options.pan, 'overScaleMode')) {
      console.warn('The option `overScaleMode` is deprecated. Please use `scaleMode` instead (and update `mode` as desired).');
    }

    if (Hammer) {
      startHammer(chart, options);
    }

    chart.pan = (delta, panScales, transition) => pan(chart, delta, panScales, transition);
    chart.zoom = (args, transition) => zoom(chart, args, transition);
    chart.zoomRect = (p0, p1, transition) => zoomRect(chart, p0, p1, transition);
    chart.zoomScale = (id, range, transition) => zoomScale(chart, id, range, transition);
    chart.resetZoom = (transition) => resetZoom(chart, transition);
    chart.getZoomLevel = () => getZoomLevel(chart);
    chart.getInitialScaleBounds = () => getInitialScaleBounds(chart);
    chart.getZoomedScaleBounds = () => getZoomedScaleBounds(chart);
    chart.isZoomedOrPanned = () => isZoomedOrPanned(chart);
    chart.isZoomingOrPanning = () => isZoomingOrPanning(chart);
  },

  beforeEvent(chart, {event}) {
    if (isZoomingOrPanning(chart)) {
      // cancel any event handling while panning or dragging
      return false;
    }
    // cancel the next click or mouseup after drag or pan
    if (event.type === 'click' || event.type === 'mouseup') {
      const state = getState(chart);
      if (state.filterNextClick) {
        state.filterNextClick = false;
        return false;
      }
    }
  },

  beforeUpdate: function(chart, args, options) {
    const state = getState(chart);
    const previousOptions = state.options;
    state.options = options;

    // Hammer needs to be restarted when certain options change.
    if (hammerOptionsChanged(previousOptions, options)) {
      stopHammer(chart);
      startHammer(chart, options);
    }

    addListeners(chart, options);
  },

  beforeDatasetsDraw(chart, _args, options) {
    draw(chart, 'beforeDatasetsDraw', options);
  },

  afterDatasetsDraw(chart, _args, options) {
    draw(chart, 'afterDatasetsDraw', options);
  },

  beforeDraw(chart, _args, options) {
    draw(chart, 'beforeDraw', options);
  },

  afterDraw(chart, _args, options) {
    draw(chart, 'afterDraw', options);
  },

  stop: function(chart) {
    removeListeners(chart);

    if (Hammer) {
      stopHammer(chart);
    }
    removeState(chart);
  },

  panFunctions,
  zoomFunctions,
  zoomRectFunctions,
};

1	import Hammer from 'hammerjs';
2	import {addListeners, computeDragRect, removeListeners} from './handlers';
3	import {hammerOptionsChanged, startHammer, stopHammer} from './hammer';
4	import {pan, zoom, resetZoom, zoomScale, getZoomLevel, getInitialScaleBounds, getZoomedScaleBounds, isZoomedOrPanned, isZoomingOrPanning, zoomRect} from './core';
5	import {panFunctions, zoomFunctions, zoomRectFunctions} from './scale.types';
6	import {getState, removeState} from './state';
7	import {version} from '../package.json';
8
9	function draw(chart, caller, options) {
10	const dragOptions = options.zoom.drag;	6,416✔
11	const {dragStart, dragEnd} = getState(chart);	6,416✔
12
13	if (dragOptions.drawTime !== caller \|\| !dragEnd) {	6,416✔
14	return;	6,372✔
15	}
16	const {left, top, width, height} = computeDragRect(chart, options.zoom.mode, {dragStart, dragEnd}, dragOptions.maintainAspectRatio);	44✔
17	const ctx = chart.ctx;	44✔
18
19	ctx.save();	44✔
20	ctx.beginPath();	44✔
21	ctx.fillStyle = dragOptions.backgroundColor \|\| 'rgba(225,225,225,0.3)';	44✔
22	ctx.fillRect(left, top, width, height);	44✔
23
24	if (dragOptions.borderWidth > 0) {	44✔
25	ctx.lineWidth = dragOptions.borderWidth;	8✔
26	ctx.strokeStyle = dragOptions.borderColor \|\| 'rgba(225,225,225)';	8!
27	ctx.strokeRect(left, top, width, height);	8✔
28	}
29	ctx.restore();	44✔
30	}
31
32	export default {
33	id: 'zoom',
34
35	version,
36
37	defaults: {
38	pan: {
39	enabled: false,
40	mode: 'xy',
41	threshold: 10,
42	modifierKey: null,
43	},
44	zoom: {
45	wheel: {
46	enabled: false,
47	speed: 0.1,
48	modifierKey: null
49	},
50	drag: {
51	enabled: false,
52	drawTime: 'beforeDatasetsDraw',
53	modifierKey: null
54	},
55	pinch: {
56	enabled: false
57	},
58	mode: 'xy',
59	}
60	},
61
62	start: function(chart, _args, options) {
63	const state = getState(chart);	316✔
64	state.options = options;	316✔
65
66	if (Object.prototype.hasOwnProperty.call(options.zoom, 'enabled')) {	316!
67	console.warn('The option `zoom.enabled` is no longer supported. Please use `zoom.wheel.enabled`, `zoom.drag.enabled`, or `zoom.pinch.enabled`.');	×
68	}
69	if (Object.prototype.hasOwnProperty.call(options.zoom, 'overScaleMode')	316✔
70	\|\| Object.prototype.hasOwnProperty.call(options.pan, 'overScaleMode')) {
71	console.warn('The option `overScaleMode` is deprecated. Please use `scaleMode` instead (and update `mode` as desired).');	8✔
72	}
73
74	if (Hammer) {	316✔
75	startHammer(chart, options);	316✔
76	}
77
78	chart.pan = (delta, panScales, transition) => pan(chart, delta, panScales, transition);	336✔
79	chart.zoom = (args, transition) => zoom(chart, args, transition);	316✔
80	chart.zoomRect = (p0, p1, transition) => zoomRect(chart, p0, p1, transition);	316✔
81	chart.zoomScale = (id, range, transition) => zoomScale(chart, id, range, transition);	316✔
82	chart.resetZoom = (transition) => resetZoom(chart, transition);	316✔
83	chart.getZoomLevel = () => getZoomLevel(chart);	316✔
84	chart.getInitialScaleBounds = () => getInitialScaleBounds(chart);	316✔
85	chart.getZoomedScaleBounds = () => getZoomedScaleBounds(chart);	316✔
86	chart.isZoomedOrPanned = () => isZoomedOrPanned(chart);	316✔
87	chart.isZoomingOrPanning = () => isZoomingOrPanning(chart);	316✔
88	},
89
90	beforeEvent(chart, {event}) {
91	if (isZoomingOrPanning(chart)) {	7✔
92	// cancel any event handling while panning or dragging
93	return false;	6✔
94	}
95	// cancel the next click or mouseup after drag or pan
96	if (event.type === 'click' \|\| event.type === 'mouseup') {	1!
NEW 97	const state = getState(chart);	×
NEW 98	if (state.filterNextClick) {	×
NEW 99	state.filterNextClick = false;	×
NEW 100	return false;	×
101	}
102	}
103	},
104
105	beforeUpdate: function(chart, args, options) {
106	const state = getState(chart);	1,600✔
107	const previousOptions = state.options;	1,600✔
108	state.options = options;	1,600✔
109
110	// Hammer needs to be restarted when certain options change.
111	if (hammerOptionsChanged(previousOptions, options)) {	1,600!
112	stopHammer(chart);	×
113	startHammer(chart, options);	×
114	}
115
116	addListeners(chart, options);	1,600✔
117	},
118
119	beforeDatasetsDraw(chart, _args, options) {
120	draw(chart, 'beforeDatasetsDraw', options);	1,604✔
121	},
122
123	afterDatasetsDraw(chart, _args, options) {
124	draw(chart, 'afterDatasetsDraw', options);	1,604✔
125	},
126
127	beforeDraw(chart, _args, options) {
128	draw(chart, 'beforeDraw', options);	1,604✔
129	},
130
131	afterDraw(chart, _args, options) {
132	draw(chart, 'afterDraw', options);	1,604✔
133	},
134
135	stop: function(chart) {
136	removeListeners(chart);	10,178✔
137
138	if (Hammer) {	10,178✔
139	stopHammer(chart);	10,178✔
140	}
141	removeState(chart);	10,178✔
142	},
143
144	panFunctions,
145	zoomFunctions,
146	zoomRectFunctions,
147	};

chartjs / chartjs-plugin-zoom / 11900897355

Source File Press 'n' to go to next uncovered line, 'b' for previous

Source File
Press 'n' to go to next uncovered line, 'b' for previous