diff --git a/lib/commons/table/get-headers.js b/lib/commons/table/get-headers.js index 60bbeb7d7c..927be785e3 100644 --- a/lib/commons/table/get-headers.js +++ b/lib/commons/table/get-headers.js @@ -15,13 +15,23 @@ import findUp from '../dom/find-up'; function traverseForHeaders(headerType, position, tableGrid) { const property = headerType === 'row' ? '_rowHeaders' : '_colHeaders'; const predicate = headerType === 'row' ? isRowHeader : isColumnHeader; + const startCell = tableGrid[position.y][position.x]; + + // adjust position by rowspan and colspan + // subtract 1 from col/rowspan to make them 0 indexed + const colspan = startCell.colSpan - 1; + const rowspan = startCell.rowSpan - 1; + + const rowStart = position.y + rowspan; + const colStart = position.x + colspan; + const rowEnd = headerType === 'row' ? position.y : 0; const colEnd = headerType === 'row' ? 0 : position.x; let headers; const cells = []; - for (let row = position.y; row >= rowEnd && !headers; row--) { - for (let col = position.x; col >= colEnd; col--) { + for (let row = rowStart; row >= rowEnd && !headers; row--) { + for (let col = colStart; col >= colEnd; col--) { const cell = tableGrid[row] ? tableGrid[row][col] : undefined; if (!cell) { diff --git a/test/commons/table/get-headers.js b/test/commons/table/get-headers.js index 7342923448..3a0b1e463c 100644 --- a/test/commons/table/get-headers.js +++ b/test/commons/table/get-headers.js @@ -174,4 +174,88 @@ describe('table.getHeaders', function() { axe.testUtils.flatTreeSetup(fixture.firstChild); assert.deepEqual(axe.commons.table.getHeaders(target), []); }); + + it('should handle multiple headers with colspan', function() { + fixture.innerHTML = + '' + + '' + + '' + + '' + + '' + + '' + + '' + + '' + + '' + + '' + + '' + + '
ProductAmountPrice
No available products to display
'; + + var target = $id('target'); + + axe.testUtils.flatTreeSetup(fixture.firstChild); + assert.deepEqual(axe.commons.table.getHeaders(target), [ + $id('t1'), + $id('t2') + ]); + }); + + it('should handle multiple headers with rowspan', function() { + fixture.innerHTML = + '' + + '' + + '' + + '' + + '' + + '' + + '' + + '' + + '
ProjectsFoo
Projects
Projects
'; + + var target = $id('target'); + + axe.testUtils.flatTreeSetup(fixture.firstChild); + assert.deepEqual(axe.commons.table.getHeaders(target), [ + $id('t1'), + $id('t2') + ]); + }); + + it('should handle negative colspan', function() { + fixture.innerHTML = + '' + + '' + + '' + + '' + + '' + + '' + + '' + + '' + + '' + + '' + + '' + + '
ProductAmountPrice
No available products to display
'; + + var target = $id('target'); + + axe.testUtils.flatTreeSetup(fixture.firstChild); + assert.deepEqual(axe.commons.table.getHeaders(target), [$id('t1')]); + }); + + it('should handle negative rowspan', function() { + fixture.innerHTML = + '' + + '' + + '' + + '' + + '' + + '' + + '' + + '' + + '
ProjectsFoo
Projects
Projects
'; + + var target = $id('target'); + + axe.testUtils.flatTreeSetup(fixture.firstChild); + assert.deepEqual(axe.commons.table.getHeaders(target), [$id('t1')]); + }); });