Skip to content

Commit 57d887b

Browse files
committed
fix: removing getWidth
1 parent 15321b4 commit 57d887b

3 files changed

Lines changed: 0 additions & 72 deletions

File tree

packages/gridjs/src/util/width.ts

Lines changed: 0 additions & 23 deletions
Original file line numberDiff line numberDiff line change
@@ -14,26 +14,3 @@ export function px(width: number): string {
1414
if (!width) return '';
1515
return `${Math.floor(width)}px`;
1616
}
17-
18-
/**
19-
* Accepts a ShadowTable and tries to find the clientWidth
20-
* that is already rendered on the web browser
21-
*
22-
* @param shadowTable
23-
* @param columnId
24-
*/
25-
export function getWidth(shadowTable: Element, columnId: string): number {
26-
if (!shadowTable) {
27-
return null;
28-
}
29-
30-
const td = shadowTable.querySelector(
31-
`thead th[data-column-id="${columnId}"]`,
32-
);
33-
34-
if (td) {
35-
return td.clientWidth;
36-
}
37-
38-
return null;
39-
}

packages/gridjs/tests/view/__snapshots__/container.test.tsx.snap

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -19,5 +19,3 @@ exports[`Container component should render a container with searchable table 1`]
1919
exports[`Container component should render a container with sortable and paginated table 1`] = `"<div role=\\"complementary\\" class=\\"gridjs gridjs-container\\" style=\\"width: 100%;\\"><div class=\\"gridjs-head\\"><div class=\\"gridjs-search\\"><input type=\\"search\\" placeholder=\\"Type a keyword...\\" aria-label=\\"Type a keyword...\\" class=\\"gridjs-input gridjs-search-input\\"></div></div><div class=\\"gridjs-wrapper\\" style=\\"height: auto;\\"><table role=\\"grid\\" class=\\"gridjs-table\\" style=\\"height: auto;\\"><thead class=\\"gridjs-thead\\"><tr class=\\"gridjs-tr\\"><th data-column-id=\\"c1\\" class=\\"gridjs-th\\"><div class=\\"gridjs-th-content\\">c1</div></th><th data-column-id=\\"c2\\" class=\\"gridjs-th gridjs-th-sort\\" tabindex=\\"0\\"><div class=\\"gridjs-th-content\\">c2</div><button tabindex=\\"-1\\" aria-label=\\"Sort column ascending\\" title=\\"Sort column ascending\\" class=\\"gridjs-sort gridjs-sort-neutral\\"></button></th><th data-column-id=\\"c3\\" class=\\"gridjs-th gridjs-th-sort\\" tabindex=\\"0\\"><div class=\\"gridjs-th-content\\">c3</div><button tabindex=\\"-1\\" aria-label=\\"Sort column ascending\\" title=\\"Sort column ascending\\" class=\\"gridjs-sort gridjs-sort-neutral\\"></button></th></tr></thead><tbody class=\\"gridjs-tbody\\"><tr class=\\"gridjs-tr\\"><td data-column-id=\\"c1\\" class=\\"gridjs-td\\">1</td><td data-column-id=\\"c2\\" class=\\"gridjs-td\\">2</td><td data-column-id=\\"c3\\" class=\\"gridjs-td\\">3</td></tr><tr class=\\"gridjs-tr\\"><td data-column-id=\\"c1\\" class=\\"gridjs-td\\">a</td><td data-column-id=\\"c2\\" class=\\"gridjs-td\\">b</td><td data-column-id=\\"c3\\" class=\\"gridjs-td\\">c</td></tr></tbody></table></div><div class=\\"gridjs-footer\\"><div class=\\"gridjs-pagination\\"><div role=\\"status\\" aria-live=\\"polite\\" class=\\"gridjs-summary\\" title=\\"Page 1 of 1\\">Showing <b>1</b> to <b>2</b> of <b>2</b> results</div><div class=\\"gridjs-pages\\"><button tabindex=\\"0\\" role=\\"button\\" disabled=\\"\\" title=\\"Previous\\" aria-label=\\"Previous\\" class=\\"\\">Previous</button><button tabindex=\\"0\\" role=\\"button\\" class=\\"gridjs-currentPage\\" title=\\"Page 1\\" aria-label=\\"Page 1\\">1</button><button tabindex=\\"0\\" role=\\"button\\" disabled=\\"\\" title=\\"Next\\" aria-label=\\"Next\\" class=\\"\\">Next</button></div></div></div><div id=\\"gridjs-temp\\" class=\\"gridjs-temp\\"></div></div>"`;
2020
2121
exports[`Container component should render a container with table 1`] = `"<div role=\\"complementary\\" class=\\"gridjs gridjs-container\\" style=\\"width: 100%;\\"><div class=\\"gridjs-wrapper\\" style=\\"height: auto;\\"><table role=\\"grid\\" class=\\"gridjs-table\\" style=\\"height: auto;\\"><tbody class=\\"gridjs-tbody\\"><tr class=\\"gridjs-tr\\"><td class=\\"gridjs-td\\">1</td><td class=\\"gridjs-td\\">2</td><td class=\\"gridjs-td\\">3</td></tr><tr class=\\"gridjs-tr\\"><td class=\\"gridjs-td\\">a</td><td class=\\"gridjs-td\\">b</td><td class=\\"gridjs-td\\">c</td></tr></tbody></table></div><div id=\\"gridjs-temp\\" class=\\"gridjs-temp\\"></div></div>"`;
22-
23-
exports[`Container component should render a table with correct th widths 1`] = `"<div role=\\"complementary\\" class=\\"gridjs gridjs-container\\" style=\\"width: 100%;\\"><div class=\\"gridjs-wrapper\\" style=\\"height: auto;\\"><table role=\\"grid\\" class=\\"gridjs-table\\" style=\\"height: auto;\\"><thead class=\\"gridjs-thead\\"><tr class=\\"gridjs-tr\\"><th class=\\"gridjs-th\\"><div class=\\"gridjs-th-content\\">hello world</div></th><th class=\\"gridjs-th gridjs-th-sort\\" tabindex=\\"0\\"><div class=\\"gridjs-th-content\\">you are super cool</div><button tabindex=\\"-1\\" aria-label=\\"Sort column ascending\\" title=\\"Sort column ascending\\" class=\\"gridjs-sort gridjs-sort-neutral\\"></button></th><th class=\\"gridjs-th gridjs-th-sort\\" style=\\"width: 200px;\\" tabindex=\\"0\\"><div class=\\"gridjs-th-content\\">actions</div><button tabindex=\\"-1\\" aria-label=\\"Sort column ascending\\" title=\\"Sort column ascending\\" class=\\"gridjs-sort gridjs-sort-neutral\\"></button></th></tr></thead><tbody class=\\"gridjs-tbody\\"><tr class=\\"gridjs-tr\\"><td class=\\"gridjs-td\\">1</td><td class=\\"gridjs-td\\">2</td><td class=\\"gridjs-td\\">3</td></tr><tr class=\\"gridjs-tr\\"><td class=\\"gridjs-td\\">a</td><td class=\\"gridjs-td\\">b</td><td class=\\"gridjs-td\\">c</td></tr></tbody></table></div><div id=\\"gridjs-temp\\" class=\\"gridjs-temp\\"></div></div>"`;

packages/gridjs/tests/view/container.test.tsx

Lines changed: 0 additions & 47 deletions
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,11 @@
11
import { mount } from 'enzyme';
2-
import { JSDOM } from 'jsdom';
32
import { h } from 'preact';
43
import { axe, toHaveNoViolations } from 'jest-axe';
54
import { Config } from '../../src/config';
65
import { Container } from '../../src/view/container';
76
import StorageUtils from '../../src/storage/storageUtils';
87
import Header from '../../src/header';
98
import { PipelineProcessor, ProcessorType } from '../../src/pipeline/processor';
10-
import * as width from '../../src/util/width';
119
import { flushPromises } from '../testUtil';
1210
import PipelineUtils from '../../src/pipeline/pipelineUtils';
1311
import { EventEmitter } from '../../src/util/eventEmitter';
@@ -264,51 +262,6 @@ describe('Container component', () => {
264262
expect(await axe(container.html())).toHaveNoViolations();
265263
});
266264

267-
it('should render a table with correct th widths', async () => {
268-
const wrapper = new JSDOM('<div style="width: 500px"></div>');
269-
270-
const mock = jest.spyOn(width, 'getWidth');
271-
mock.mockReturnValue(42);
272-
273-
config.container = wrapper;
274-
config.header = new Header();
275-
config.header.columns = [
276-
{
277-
name: 'hello world',
278-
sort: {
279-
enabled: false,
280-
},
281-
},
282-
{
283-
name: 'you are super cool',
284-
sort: {
285-
enabled: true,
286-
},
287-
},
288-
{
289-
name: 'actions',
290-
width: '200px',
291-
sort: {
292-
enabled: true,
293-
},
294-
},
295-
];
296-
297-
const container = mount(
298-
<Container
299-
config={config}
300-
pipeline={config.pipeline}
301-
width={config.width}
302-
height={config.height}
303-
/>,
304-
);
305-
306-
return flushPromises().then(async () => {
307-
await container.instance().componentDidMount();
308-
expect(container.html()).toMatchSnapshot();
309-
});
310-
});
311-
312265
it('should render a container with null array', async () => {
313266
config.data = [];
314267
config.storage = StorageUtils.createFromUserConfig(config);

0 commit comments

Comments
 (0)