Skip to content

Commit

Permalink
feat: add tests
Browse files Browse the repository at this point in the history
  • Loading branch information
Osman Minaz committed May 29, 2024
1 parent 306ed4b commit 993f048
Show file tree
Hide file tree
Showing 2 changed files with 227 additions and 0 deletions.
116 changes: 116 additions & 0 deletions src/elements-experimental/pearl-chain/pearl-chain.spec.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -9,6 +9,8 @@ import type { SbbPearlChainElement } from './pearl-chain.js';

import './pearl-chain.js';

const now = new Date('2022-08-16T15:00:00Z').valueOf();

describe(`sbb-pearl-chain`, () => {
describe('sbb-pearl-chain with one leg', () => {
it('renders component with config', async () => {
Expand Down Expand Up @@ -173,4 +175,118 @@ describe(`sbb-pearl-chain`, () => {
`);
});
});

describe('sbb-pearl-chain with cancelled legs', () => {
it('renders component with progress leg', async () => {
const element = await fixture<SbbPearlChainElement>(
html`<sbb-pearl-chain data-now="${now}"></sbb-pearl-chain>`,
);
element.legs = [
{
__typename: 'PTRideLeg',
arrival: { time: '2022-08-16T16:00:00Z' },
departure: { time: '2022-08-16T14:00:00Z' },
serviceJourney: {
serviceAlteration: {
cancelled: false,
},
},
} as PtRideLeg,
{
__typename: 'PTRideLeg',
arrival: { time: '2022-08-16T18:00:00Z' },
departure: { time: '2022-08-16T17:00:00Z' },
serviceJourney: {
serviceAlteration: {
cancelled: false,
},
},
} as PtRideLeg,
];

await waitForLitRender(element);
expect(element).dom.to.be.equal(
`<sbb-pearl-chain data-now="1660662000000"></sbb-pearl-chain>`,
);
expect(element).shadowDom.to.be.equal(`
<div class="sbb-pearl-chain">
<span class="sbb-pearl-chain__bullet sbb-pearl-chain__bullet--progress"></span>
<div
class="sbb-pearl-chain__leg sbb-pearl-chain__leg--past"
style="--sbb-pearl-chain-leg-width:66.66666666666666%;"
>
</div>
<div
class="sbb-pearl-chain__leg sbb-pearl-chain__leg--future"
style="--sbb-pearl-chain-leg-width:33.33333333333333%;"
>
<span class="sbb-pearl-chain__stop">
</span>
</div>
<span class="sbb-pearl-chain__bullet sbb-pearl-chain__bullet--future">
</span>
</div>
`);
});

it('renders component with cancelled instead of progress leg', async () => {
const element = await fixture<SbbPearlChainElement>(
html`<sbb-pearl-chain data-now="${now}"></sbb-pearl-chain>`,
);
element.legs = [
{
__typename: 'PTRideLeg',
arrival: { time: '2022-08-16T16:00:00Z' },
departure: { time: '2022-08-16T14:00:00Z' },
serviceJourney: {
serviceAlteration: {
cancelled: false,
},
stopPoints: [
{
stopStatus: 'NOT_SERVICED',
},
{
stopStatus: 'PLANNED',
},
],
},
} as PtRideLeg,
{
__typename: 'PTRideLeg',
arrival: { time: '2022-08-16T18:00:00Z' },
departure: { time: '2022-08-16T17:00:00Z' },
serviceJourney: {
serviceAlteration: {
cancelled: false,
},
},
} as PtRideLeg,
];

await waitForLitRender(element);
expect(element).dom.to.be.equal(
`<sbb-pearl-chain data-now="1660662000000"></sbb-pearl-chain>`,
);
expect(element).shadowDom.to.be.equal(`
<div class="sbb-pearl-chain">
<span class="sbb-pearl-chain--departure-skipped sbb-pearl-chain__bullet sbb-pearl-chain__bullet--progress"></span>
<div
class="sbb-pearl-chain__leg sbb-pearl-chain__leg--skipped"
style="--sbb-pearl-chain-leg-width:66.66666666666666%;"
>
</div>
<div
class="sbb-pearl-chain__leg sbb-pearl-chain__leg--future"
style="--sbb-pearl-chain-leg-width:33.33333333333333%;"
>
<span class="sbb-pearl-chain__stop">
</span>
</div>
<span class="sbb-pearl-chain__bullet sbb-pearl-chain__bullet--future">
</span>
</div>
`);
});
});
});
111 changes: 111 additions & 0 deletions src/elements-experimental/timetable-row/timetable-row.spec.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -12,6 +12,7 @@ import {
busTrip,
partiallyCancelled,
walkTimeTrip,
trainTrip,
} from './timetable-row.sample-data.js';

const now = new Date('2022-08-16T15:00:00Z').valueOf();
Expand Down Expand Up @@ -110,6 +111,116 @@ describe(`sbb-timetable-row`, () => {
});
});

describe('sbb-timetable-row with platform', () => {
it('renders component with config', async () => {
element = await fixture(html`<sbb-timetable-row data-now="${now}"></sbb-timetable-row>`);

element.trip = trainTrip as ITripItem;
await waitForLitRender(element);

expect(element).dom.to.be.equal(`
<sbb-timetable-row data-now="1660662000000" role="rowgroup">
</sbb-timetable-row>
`);

expect(element).shadowDom.to.be.equal(`
<sbb-card
color="white"
data-action-role="button"
data-has-action=""
size="l"
>
<sbb-card-button
data-action=""
data-button=""
dir="ltr"
role="button"
slot="action"
tabindex="0"
>
Departure: 16:30, on Pl. 4, Train, IR 35, Direction Chur, Arrival: 17:06, Travel time 41 Minutes, 2 changes, First Class Low to medium occupancy expected. Second Class High occupancy expected.
</sbb-card-button>
<div
class="sbb-timetable__row"
role="row"
>
<div
class="sbb-timetable__row-header"
role="gridcell"
>
<div class="sbb-timetable__row-details">
<span class="sbb-timetable__row-transport-wrapper">
<sbb-icon
aria-hidden="true"
class="sbb-timetable__row-transport-icon"
data-namespace="picto"
name="picto:train-right"
role="img"
>
</sbb-icon>
<span class="sbb-screen-reader-only">
Train
</span>
</span>
<span class="sbb-timetable__row-transport">
<sbb-icon
aria-hidden="true"
data-namespace="default"
name="ic-35"
role="img"
>
</sbb-icon>
<span class="sbb-screen-reader-only">
</span>
</span>
</div>
<p>
Direction Chur
</p>
</div>
<sbb-pearl-chain-time
data-now="1660662000000"
role="gridcell"
>
</sbb-pearl-chain-time>
<div
class="sbb-timetable__row-footer"
role="gridcell"
>
<span>
<span class="sbb-screen-reader-only">
Departure
</span>
<span class="sbb-timetable__row--quay">
<span class="sbb-screen-reader-only">
on Pl.
</span>
<span
aria-hidden="true"
class="sbb-timetable__row--quay-type"
>
Pl.
</span>
</span>
4
</span>
<sbb-timetable-occupancy>
</sbb-timetable-occupancy>
<time>
<span class="sbb-screen-reader-only">
Travel time 41 Minutes
</span>
<span aria-hidden="true">
41 min
</span>
</time>
</div>
</div>
</sbb-card>
`);
});
});

describe('sbb-timetable-row with BusTrip', () => {
it('renders component with config', async () => {
element = await fixture(html`<sbb-timetable-row data-now="${now}"></sbb-timetable-row>`);
Expand Down

0 comments on commit 993f048

Please sign in to comment.