import { d3, initChart } from './c3-helper' describe('drag behavior', function() { 'use strict' var chart, shapes, $$, totalshapes var args = { data: { x: 'x', columns: [ ['x', 10, 30, 45, 50, 70, 100], ['data1', 30, 200, 100, 400, 150, 250], ['data2', 20, 180, 240, 100, 190] ], selection: { enabled: true, grouped: true, multiple: true, draggable: true } } } beforeAll(function(done) { chart = initChart(chart, args, done) $$ = chart.internal shapes = $$.main .selectAll('.' + $$.CLASS.shapes) .selectAll('.' + $$.CLASS.shape) totalshapes = shapes.size() }) it('should contain 15 shapes', function() { expect(totalshapes).toBe(15) }) it('should have no selected shapes', function() { var selected = shapes .filter(function() { return d3.select(this).classed($$.CLASS.SELECTED) }) .size() expect(selected).toBe(0) }) describe('Trigger drag events', function() { beforeAll(function() { var s = chart.internal.eventRect, coords1 = [ (s.attr('width') - s.attr('x')) / 3, (s.attr('height') - s.attr('y')) / 3 ], coords2 = [ (2 * (s.attr('width') - s.attr('x'))) / 3, (2 * (s.attr('height') - s.attr('y'))) / 3 ] $$.dragstart(coords1) $$.drag(coords2) $$.dragend() }) it('should select 6 shapes', function() { var selected = shapes .filter(function() { return d3.select(this).classed($$.CLASS.SELECTED) }) .size() expect(selected).toBe(6) }) it('should select 9 unselected shapes', function() { var unselected = shapes .filter(function() { return !d3.select(this).classed($$.CLASS.SELECTED) }) .size() expect(unselected).toBe(9) }) describe('Selected api', function() { it('should return 6 selected shapes', function() { var selected = chart.selected() expect(selected.length).toBe(6) }) it('should return 3 selected shapes with targetId = data1', function() { var selected = chart.selected('data1') expect(selected.length).toBe(3) }) }) }) })