1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
|
var target = '#qunit-fixture',
defaults;
module('bar', {
setup: function() {
defaults = {
target: target,
chart_type: 'bar',
x_accessor: 'value',
y_accessor: 'label',
transition_on_update: false,
data: [{
label: 'Bar 1',
value: 100
},{
label: 'Bar 2',
value: 200
},{
label: 'Bar 3',
value: 300
}]
};
}
});
test('Correct number of bars are added', function() {
expect(1);
MG.data_graphic(defaults);
equal(document.querySelectorAll('.mg-bar').length, 3, 'Should have 3 bars');
});
test('Triggers callbacks when provided', function() {
var mouseoverCalled = false,
mousemoveCalled = false,
mouseoutCalled = false,
params = extend(defaults, {
mouseover: function() {
mouseoverCalled = true;
},
mousemove: function() {
mousemoveCalled = true;
},
mouseout: function() {
mouseoutCalled = true;
}
});
MG.data_graphic(params);
var bar = document.getElementsByClassName('mg-bar-rollover')[0];
bar.dispatchEvent(generateMouseEvent('mouseover'));
equal(mouseoverCalled, true, 'mouseover was called');
bar.dispatchEvent(generateMouseEvent('mousemove'));
equal(mousemoveCalled, true, 'mousemove was called');
bar.dispatchEvent(generateMouseEvent('mouseout'));
equal(mouseoutCalled, true, 'mouseout was called');
});
// test('When updating', function() {
// var bars = [{
// label: 'Bar 1',
// value: 100,
// predictor: 75,
// baseline: 50
// }];
// var params = extend(defaults, {
// data: bars,
// height: 100,
// width: 300,
// orientation: 'vertical',
// predictor_accessor: 'predictor',
// baseline_accessor: 'baseline',
// animate_on_load: false,
// transition_on_update: false
// });
// MG.data_graphic(params);
// equal(164, d3.select(target).select('.mg-barplot .mg-bar').attr('width'), 'initial bar size is correct');
// equal(123, d3.select(target).select('.mg-barplot .mg-bar-prediction').attr('width'), 'initial predictor size is correct');
// equal(160, d3.select(target).select('.mg-barplot .mg-bar-baseline').attr('x1'), 'initial baseline position is correct');
// params.data[0][0].value = 50;
// params.data[0][0].predictor = 100;
// params.data[0][0].baseline = 75;
// MG.data_graphic(params);
// equal(82, d3.select(target).select('.mg-barplot .mg-bar').attr('width'), 'the bars are redrawn with correct sizes');
// equal(164, d3.select(target).select('.mg-barplot .mg-bar-prediction').attr('width'), 'the predictors are redrawn with correct sizes');
// equal(201, d3.select(target).select('.mg-barplot .mg-bar-baseline').attr('x1'), 'the baseline is redrawn in the correct position');
// });
|