Skip to content

Commit

Permalink
fix(grid): Fix grid text position update
Browse files Browse the repository at this point in the history
Remove unnecessary doubly transition wrapping

Fix #1592
  • Loading branch information
netil authored Aug 11, 2020
1 parent b4d5302 commit 056b565
Show file tree
Hide file tree
Showing 2 changed files with 145 additions and 2 deletions.
4 changes: 2 additions & 2 deletions src/ChartInternal/internals/grid.ts
Original file line number Diff line number Diff line change
Expand Up @@ -311,8 +311,8 @@ export default {
.text(d => d.text);

return [
(withTransition ? lines.transition() : lines).style("opacity", "1"),
(withTransition ? texts.transition() : texts).style("opacity", "1")
lines.style("opacity", "1"),
texts.style("opacity", "1")
];
},

Expand Down
143 changes: 143 additions & 0 deletions test/internals/grid-spec.ts
Original file line number Diff line number Diff line change
Expand Up @@ -684,4 +684,147 @@ describe("GRID", function() {
]);
});
});

describe("Grid text position", () => {
before(() => {
args = {
data: {
columns: [
["sample", 30, 200, 100, 400, 150, 250, 150, 200, 170, 240, 350, 150, 100, 400, 150,
250, 150, 200, 170, 240, 100, 150, 250, 150, 200, 170, 240, 30, 200, 100, 400,
150, 250, 150, 200, 170, 240, 350, 150, 100, 400, 350, 220, 250, 300, 270, 140,
150, 90, 150, 50, 120, 70, 40, 200, 100, 400, 150, 250, 150, 200, 170, 240, 350,
150, 100, 400, 150, 250, 150, 200, 170, 240, 100, 150, 250, 150, 200, 170, 240,
30, 200, 100, 400, 150, 250, 150, 200, 170, 240, 350, 150, 100, 400, 350, 220, 250,
300, 270, 140, 150, 90, 150, 50, 120, 70, 40, 200, 100, 400, 150, 250, 150, 200,
170, 240, 350, 150, 100, 400, 150, 250, 150, 200, 170, 240, 100, 150, 250, 150, 200,
170, 240, 30, 200, 100, 400, 150, 250, 150, 200, 170, 240, 350, 150, 100, 400, 350,
220, 250, 300, 270, 140, 150, 90, 150, 50, 120, 70, 40, 200, 100, 400, 150, 250, 150,
200, 170, 240, 350, 150, 100, 400, 150, 250, 150, 200, 170, 240, 100, 150, 250, 150,
200, 170, 240, 30, 200, 100, 400, 150, 250, 150, 200, 170, 240, 350, 150, 100, 400,
350, 220, 250, 300, 270, 140, 150, 90, 150, 50, 120, 70, 40, 200, 100, 400, 150, 250,
150, 200, 170, 240, 350, 150, 100, 400, 150, 250, 150, 200, 170, 240, 100, 150, 250,
150, 200, 170, 240, 30, 200, 100, 400, 150, 250, 150, 200, 170, 240, 350, 150, 100,
400, 350, 220, 250, 300, 270, 140, 150, 90, 150, 50, 120, 70, 40, 200, 100, 400, 150,
250, 150, 200, 170, 240, 350, 150, 100, 400, 150, 250, 150, 200, 170, 240, 100, 150,
250, 150, 200, 170, 240, 30, 200, 100, 400, 150, 250, 150, 200, 170, 240, 350, 150,
100, 400, 350, 220, 250, 300, 270, 140, 150, 90, 150, 50, 120, 70, 40, 200, 100, 400,
150, 250, 150, 200, 170, 240, 350, 150, 100, 400, 150, 250, 150, 200, 170, 240, 100,
150, 250, 150, 200, 170, 240, 30, 200, 100, 400, 150, 250, 150, 200, 170, 240, 350,
150, 100, 400, 350, 220, 250, 300, 270, 140, 150, 90, 150, 50, 120, 70, 40, 200, 100,
400, 150, 250, 150, 200, 170, 240, 350, 150, 100, 400, 150, 250, 150, 200, 170, 240,
100, 150, 250, 150, 200, 170, 240, 30, 200, 100, 400, 150, 250, 150, 200, 170, 240,
350, 150, 100, 400, 350, 220, 250, 300, 270, 140, 150, 90, 150, 50, 120, 70, 40, 200,
100, 400, 150, 250, 150, 200, 170, 240, 350, 150, 100, 400, 150, 250, 150, 200, 170,
240, 100, 150, 250, 150, 200, 170, 240, 30, 200, 100, 400, 150, 250, 150, 200, 170,
240, 350, 150, 100, 400, 350, 220, 250, 300, 270, 140, 150, 90, 150, 50, 120, 70, 40,
200, 100, 400, 150, 250, 150, 200, 170, 240, 350, 150, 100, 400, 150, 250, 150, 200,
170, 240, 100, 150, 250, 150, 200, 170, 240, 30, 200, 100, 400, 150, 250, 150, 200,
170, 240, 350, 150, 100, 400, 350, 220, 250, 300, 270, 140, 150, 90, 150, 50, 120, 70,
40, 200, 100, 400, 150, 250, 150, 200, 170, 240, 350, 150, 100, 400, 150, 250, 150, 200,
170, 240, 100, 150, 250, 150, 200, 170, 240, 30, 200, 100, 400, 150, 250, 150, 200, 170,
240, 350, 150, 100, 400, 350, 220, 250, 300, 270, 140, 150, 90, 150, 50, 120, 70, 40,
200, 100, 400, 150, 250, 150, 200, 170, 240, 350, 150, 100, 400, 150, 250, 150, 200, 170,
240, 100, 150, 250, 150, 200, 170, 240, 30, 200, 100, 400, 150, 250, 150, 200, 170, 240,
350, 150, 100, 400, 350, 220, 250, 300, 270, 140, 150, 90, 150, 50, 120, 70, 40, 200, 100,
400, 150, 250, 150, 200, 170, 240, 350, 150, 100, 400, 150, 250, 150, 200, 170, 240, 100,
150, 250, 150, 200, 170, 240, 30, 200, 100, 400, 150, 250, 150, 200, 170, 240, 350, 150,
100, 400, 350, 220, 250, 300, 270, 140, 150, 90, 150, 50, 120, 70, 40, 200, 100, 400, 150,
250, 150, 200, 170, 240, 350, 150, 100, 400, 150, 250, 150, 200, 170, 240, 100, 150, 250,
150, 200, 170, 240, 30, 200, 100, 400, 150, 250, 150, 200, 170, 240, 350, 150, 100, 400,
350, 220, 250, 300, 270, 140, 150, 90, 150, 50, 120, 70, 40, 200, 100, 400, 150, 250, 150,
200, 170, 240, 350, 150, 100, 400, 150, 250, 150, 200, 170, 240, 100, 150, 250, 150, 200, 170,
240, 30, 200, 100, 400, 150, 250, 150, 200, 170, 240, 350, 150, 100, 400, 350, 220, 250, 300,
270, 140, 150, 90, 150, 50, 120, 70, 40, 200, 100, 400, 150, 250, 150, 200, 170, 240, 350, 150,
100, 400, 150, 250, 150, 200, 170, 240, 100, 150, 250, 150, 200, 170, 240, 30, 200, 100, 400,
150, 250, 150, 200, 170, 240, 350, 150, 100, 400, 350, 220, 250, 300, 270, 140, 150, 90, 150,
50, 120, 70, 40, 200, 100, 400, 150, 250, 150, 200, 170, 240, 350, 150, 100, 400, 150, 250, 150,
200, 170, 240, 100, 150, 250, 150, 200, 170, 240, 30, 200, 100, 400, 150, 250, 150, 200, 170,
240, 350, 150, 100, 400, 350, 220, 250, 300, 270, 140, 150, 90, 150, 50, 120, 70, 40, 200, 100,
400, 150, 250, 150, 200, 170, 240, 350, 150, 100, 400, 150, 250, 150, 200, 170, 240, 100, 150,
250, 150, 200, 170, 240, 30, 200, 100, 400, 150, 250, 150, 200, 170, 240, 350, 150, 100, 400,
350, 220, 250, 300, 270, 140, 150, 90, 150, 50, 120, 70, 40, 200, 100, 400, 150, 250, 150, 200,
170, 240, 350, 150, 100, 400, 150, 250, 150, 200, 170, 240, 100, 150, 250, 150, 200, 170, 240,
30, 200, 100, 400, 150, 250, 150, 200, 170, 240, 350, 150, 100, 400, 350, 220, 250, 300, 270,
140, 150, 90, 150, 50, 120, 70, 40, 200, 100, 400, 150, 250, 150, 200, 170, 240, 350, 150, 100,
400, 150, 250, 150, 200, 170, 240, 100, 150, 250, 150, 200, 170, 240, 30, 200, 100, 400, 150,
250, 150, 200, 170, 240, 350, 150, 100, 400, 350, 220, 250, 300, 270, 140, 150, 90, 150, 50,
120, 70, 40, 200, 100, 400, 150, 250, 150, 200, 170, 240, 350, 150, 100, 400, 150, 250, 150,
200, 170, 240, 100, 150, 250, 150, 200, 170, 240, 30, 200, 100, 400, 150, 250, 150, 200, 170,
240, 350, 150, 100, 400, 350, 220, 250, 300, 270, 140, 150, 90, 150, 50, 120, 70, 40, 200, 100,
150, 250, 150, 200, 170, 240, 350, 150, 100, 400, 150, 250, 150, 200, 170, 240, 100, 150, 250,
150, 200, 170, 240, 30, 200, 100, 400, 150, 250, 150, 200, 170, 240, 350, 150, 100, 400, 350,
220, 250, 300, 270, 140, 150, 90, 150, 50, 120, 70, 40, 400
]
]
},
grid: {
x: {
lines: [
{
value: 100,
text: "S"
},
{
value: 300,
text: "S"
},
{
value: 500,
text: "S"
}
]
}
},
point: {
focus: { only: true }
},
zoom: {
enabled: true,
type: "drag"
}
};
});

it("Grid text position should be updated", done => {
const {main} = chart.$;
const eventRect = main.select(`.${CLASS.eventRect}-75`).node();

new Promise((resolve, reject) => {
util.fireEvent(eventRect, "mousedown", {
clientX: 100,
clientY: 150
}, chart);

resolve();
}).then(() => {
return new Promise((resolve, reject) => {
setTimeout(() => {
util.fireEvent(eventRect, "mousemove", {
clientX: 300,
clientY: 150
}, chart);

resolve();
}, 500);
});
}).then(() => {
setTimeout(() => {
util.fireEvent(eventRect, "mouseup", {
clientX: 300,
clientY: 150
}, chart);

main.selectAll(`.${CLASS.gridLines} .${CLASS.xgridLine}`).each(function() {
const lineX = +this.querySelector("line").getAttribute("x1");
const textY = +this.querySelector("text").getAttribute("y");

expect(lineX).to.be.equal(textY);
});

done();
}, 500);
});
});
});
});

0 comments on commit 056b565

Please sign in to comment.