diff --git a/test/spec/svg/lines.js b/test/spec/svg/lines.js index b4b892b3f..f464929db 100644 --- a/test/spec/svg/lines.js +++ b/test/spec/svg/lines.js @@ -2,7 +2,8 @@ describe("iD.svg.Lines", function () { var surface, projection = d3.geo.projection(function(x, y) { return [x, y]; }) .clipExtent([[0, 0], [Infinity, Infinity]]), - filter = d3.functor(true); + all = d3.functor(true), + none = d3.functor(false); beforeEach(function () { surface = d3.select(document.createElementNS('http://www.w3.org/2000/svg', 'svg')) @@ -15,7 +16,7 @@ describe("iD.svg.Lines", function () { line = iD.Way({nodes: [a.id, b.id]}), graph = iD.Graph([a, b, line]); - surface.call(iD.svg.Lines(projection), graph, [line], filter); + surface.call(iD.svg.Lines(projection), graph, [line], all); expect(surface.select('path.way')).to.be.classed('way'); expect(surface.select('path.line')).to.be.classed('line'); @@ -27,7 +28,7 @@ describe("iD.svg.Lines", function () { line = iD.Way({nodes: [a.id, b.id], tags: {highway: 'residential'}}), graph = iD.Graph([a, b, line]); - surface.call(iD.svg.Lines(projection), graph, [line], filter); + surface.call(iD.svg.Lines(projection), graph, [line], all); expect(surface.select('.line')).to.be.classed('tag-highway'); expect(surface.select('.line')).to.be.classed('tag-highway-residential'); @@ -40,7 +41,7 @@ describe("iD.svg.Lines", function () { relation = iD.Relation({members: [{id: line.id}], tags: {type: 'multipolygon', natural: 'wood'}}), graph = iD.Graph([a, b, line, relation]); - surface.call(iD.svg.Lines(projection), graph, [line], filter); + surface.call(iD.svg.Lines(projection), graph, [line], all); expect(surface.select('.stroke')).to.be.classed('tag-natural-wood'); }); @@ -53,7 +54,7 @@ describe("iD.svg.Lines", function () { r = iD.Relation({members: [{id: w.id}], tags: {type: 'multipolygon'}}), graph = iD.Graph([a, b, c, w, r]); - surface.call(iD.svg.Lines(projection), graph, [w], filter); + surface.call(iD.svg.Lines(projection), graph, [w], all); expect(surface.select('.stroke')).to.be.classed('tag-natural-wood'); }); @@ -67,7 +68,7 @@ describe("iD.svg.Lines", function () { r = iD.Relation({members: [{id: o.id, role: 'outer'}, {id: i.id, role: 'inner'}], tags: {type: 'multipolygon'}}), graph = iD.Graph([a, b, c, o, i, r]); - surface.call(iD.svg.Lines(projection), graph, [i], filter); + surface.call(iD.svg.Lines(projection), graph, [i], all); expect(surface.select('.stroke')).to.be.classed('tag-natural-wood'); }); @@ -80,8 +81,54 @@ describe("iD.svg.Lines", function () { // .append('path') // .attr('class', 'other'); - // surface.call(iD.svg.Lines(projection), graph, [line], filter); + // surface.call(iD.svg.Lines(projection), graph, [line], all); // expect(surface.selectAll('.other')[0].length).to.equal(1); // }); + + describe("z-indexing", function() { + var graph = iD.Graph([ + iD.Node({id: 'a', loc: [0, 0]}), + iD.Node({id: 'b', loc: [1, 1]}), + iD.Node({id: 'c', loc: [0, 0]}), + iD.Node({id: 'd', loc: [1, 1]}), + iD.Way({id: 'lo', tags: {highway: 'residential', tunnel: 'yes'}, nodes: ['a', 'b']}), + iD.Way({id: 'hi', tags: {highway: 'residential', bridge: 'yes'}, nodes: ['c', 'd']}) + ]); + + it("stacks higher lines above lower ones in a single render", function () { + surface.call(iD.svg.Lines(projection), graph, [graph.entity('lo'), graph.entity('hi')], none); + + var selection = surface.selectAll('g.line-stroke > path.line'); + expect(selection[0][0].__data__.id).to.eql('lo'); + expect(selection[0][1].__data__.id).to.eql('hi'); + }); + + it("stacks higher lines above lower ones in a single render (reverse)", function () { + surface.call(iD.svg.Lines(projection), graph, [graph.entity('hi'), graph.entity('lo')], none); + + var selection = surface.selectAll('g.line-stroke > path.line'); + expect(selection[0][0].__data__.id).to.eql('lo'); + expect(selection[0][1].__data__.id).to.eql('hi'); + }); + + it("stacks higher lines above lower ones in separate renders", function () { + surface.call(iD.svg.Lines(projection), graph, [graph.entity('lo')], none); + surface.call(iD.svg.Lines(projection), graph, [graph.entity('hi')], none); + + var selection = surface.selectAll('g.line-stroke > path.line'); + expect(selection[0][0].__data__.id).to.eql('lo'); + expect(selection[0][1].__data__.id).to.eql('hi'); + }); + + it("stacks higher lines above lower in separate renders (reverse)", function () { + surface.call(iD.svg.Lines(projection), graph, [graph.entity('hi')], none); + surface.call(iD.svg.Lines(projection), graph, [graph.entity('lo')], none); + + var selection = surface.selectAll('g.line-stroke > path.line'); + expect(selection[0][0].__data__.id).to.eql('lo'); + expect(selection[0][1].__data__.id).to.eql('hi'); + }); + }); + });