Skip to content

Commit

Permalink
refactor(action-pane): remove h5 and h6 max to h4 (#755)
Browse files Browse the repository at this point in the history
  • Loading branch information
JakobVogelsang authored May 19, 2022
1 parent ecfeb5d commit dd9843e
Show file tree
Hide file tree
Showing 2 changed files with 4 additions and 46 deletions.
10 changes: 2 additions & 8 deletions src/action-pane.ts
Original file line number Diff line number Diff line change
Expand Up @@ -79,12 +79,8 @@ export class ActionPane extends LitElement {
return html`<h2>${content}</h2>`;
case 3:
return html`<h3>${content}</h3>`;
case 4:
return html`<h4>${content}</h4>`;
case 5:
return html`<h5>${content}</h5>`;
default:
return html`<h6>${content}</h6>`;
return html`<h4>${content}</h4>`;
}
}

Expand Down Expand Up @@ -150,9 +146,7 @@ export class ActionPane extends LitElement {
h1,
h2,
h3,
h4,
h5,
h6 {
h4 {
color: var(--mdc-theme-on-surface);
font-family: 'Roboto', sans-serif;
font-weight: 300;
Expand Down
40 changes: 2 additions & 38 deletions test/unit/action-pane.test.ts
Original file line number Diff line number Diff line change
Expand Up @@ -23,8 +23,6 @@ describe('action-pane', () => {
expect(element.shadowRoot?.querySelector('h2')).to.not.exist;
expect(element.shadowRoot?.querySelector('h3')).to.not.exist;
expect(element.shadowRoot?.querySelector('h4')).to.not.exist;
expect(element.shadowRoot?.querySelector('h5')).to.not.exist;
expect(element.shadowRoot?.querySelector('h6')).to.not.exist;
});

it('renders the header as <h1> with level 1', async () => {
Expand All @@ -34,8 +32,6 @@ describe('action-pane', () => {
expect(element.shadowRoot?.querySelector('h2')).to.not.exist;
expect(element.shadowRoot?.querySelector('h3')).to.not.exist;
expect(element.shadowRoot?.querySelector('h4')).to.not.exist;
expect(element.shadowRoot?.querySelector('h5')).to.not.exist;
expect(element.shadowRoot?.querySelector('h6')).to.not.exist;
});

it('renders the header as <h2> with level 2', async () => {
Expand All @@ -45,8 +41,6 @@ describe('action-pane', () => {
expect(element.shadowRoot?.querySelector('h1')).to.not.exist;
expect(element.shadowRoot?.querySelector('h3')).to.not.exist;
expect(element.shadowRoot?.querySelector('h4')).to.not.exist;
expect(element.shadowRoot?.querySelector('h5')).to.not.exist;
expect(element.shadowRoot?.querySelector('h6')).to.not.exist;
});

it('renders the header as <h3> with level 3', async () => {
Expand All @@ -56,8 +50,6 @@ describe('action-pane', () => {
expect(element.shadowRoot?.querySelector('h1')).to.not.exist;
expect(element.shadowRoot?.querySelector('h2')).to.not.exist;
expect(element.shadowRoot?.querySelector('h4')).to.not.exist;
expect(element.shadowRoot?.querySelector('h5')).to.not.exist;
expect(element.shadowRoot?.querySelector('h6')).to.not.exist;
});

it('renders the header as <h4> with level 4', async () => {
Expand All @@ -67,41 +59,15 @@ describe('action-pane', () => {
expect(element.shadowRoot?.querySelector('h1')).to.not.exist;
expect(element.shadowRoot?.querySelector('h2')).to.not.exist;
expect(element.shadowRoot?.querySelector('h3')).to.not.exist;
expect(element.shadowRoot?.querySelector('h5')).to.not.exist;
expect(element.shadowRoot?.querySelector('h6')).to.not.exist;
});

it('renders the header as <h5> with level 5', async () => {
element.level = 5;
await element.updateComplete;
expect(element.shadowRoot?.querySelector('h5')).to.exist;
expect(element.shadowRoot?.querySelector('h1')).to.not.exist;
expect(element.shadowRoot?.querySelector('h2')).to.not.exist;
expect(element.shadowRoot?.querySelector('h3')).to.not.exist;
expect(element.shadowRoot?.querySelector('h4')).to.not.exist;
expect(element.shadowRoot?.querySelector('h6')).to.not.exist;
});

it('renders the header as <h6> with level 6', async () => {
element.level = 6;
await element.updateComplete;
expect(element.shadowRoot?.querySelector('h6')).to.exist;
expect(element.shadowRoot?.querySelector('h1')).to.not.exist;
expect(element.shadowRoot?.querySelector('h2')).to.not.exist;
expect(element.shadowRoot?.querySelector('h3')).to.not.exist;
expect(element.shadowRoot?.querySelector('h4')).to.not.exist;
expect(element.shadowRoot?.querySelector('h5')).to.not.exist;
});

it('renders the header as <h6> for levels > 6', async () => {
it('renders the header as <h4> for levels > 4', async () => {
element.level = 7;
await element.updateComplete;
expect(element.shadowRoot?.querySelector('h6')).to.exist;
expect(element.shadowRoot?.querySelector('h4')).to.exist;
expect(element.shadowRoot?.querySelector('h1')).to.not.exist;
expect(element.shadowRoot?.querySelector('h2')).to.not.exist;
expect(element.shadowRoot?.querySelector('h3')).to.not.exist;
expect(element.shadowRoot?.querySelector('h4')).to.not.exist;
expect(element.shadowRoot?.querySelector('h5')).to.not.exist;
});

it('renders the header as <h1> for levels < 1', async () => {
Expand All @@ -111,8 +77,6 @@ describe('action-pane', () => {
expect(element.shadowRoot?.querySelector('h2')).to.not.exist;
expect(element.shadowRoot?.querySelector('h3')).to.not.exist;
expect(element.shadowRoot?.querySelector('h4')).to.not.exist;
expect(element.shadowRoot?.querySelector('h5')).to.not.exist;
expect(element.shadowRoot?.querySelector('h6')).to.not.exist;
});

it('does not set contrasted class property with odd level', async () => {
Expand Down

0 comments on commit dd9843e

Please sign in to comment.