diff --git a/ab-testing/config/abTests.ts b/ab-testing/config/abTests.ts index d3414585345..da0fc01626f 100644 --- a/ab-testing/config/abTests.ts +++ b/ab-testing/config/abTests.ts @@ -183,17 +183,6 @@ const ABTests: ABTest[] = [ groups: ["control", "variant-1"], shouldForceMetricsCollection: false, }, - { - name: "webx-cricket-redesign", - description: "Redesign of the cricket header and scorecard on web", - owners: ["dotcom.platform@theguardian.com"], - status: "ON", - expirationDate: "2026-08-01", - type: "server", - audienceSize: 0 / 100, - groups: ["enable"], - shouldForceMetricsCollection: false, - }, ]; const activeABtests = ABTests.filter((test) => test.status === "ON"); diff --git a/dotcom-rendering/playwright/fixtures/cricket-match.js b/dotcom-rendering/playwright/fixtures/cricket-match.js index 254061e6bee..8e5047e7a0b 100644 --- a/dotcom-rendering/playwright/fixtures/cricket-match.js +++ b/dotcom-rendering/playwright/fixtures/cricket-match.js @@ -1,307 +1,1044 @@ export const match1 = { - teams: [ - { - name: 'West Indies', - home: true, - }, - { - name: 'England', - home: false, - }, - ], - innings: [ - { - order: 1, - battingTeam: 'England', - runsScored: '204', - overs: '89.4', - declared: false, - forfeited: false, - fallOfWicket: [ - { - order: 1, - }, - { - order: 2, - }, - { - order: 3, - }, - { - order: 4, - }, - { - order: 5, - }, - { - order: 6, - }, - { - order: 7, - }, - { - order: 8, - }, - { - order: 9, - }, - { - order: 10, - }, - ], - }, - { - order: 2, - battingTeam: 'West Indies', - runsScored: '297', - overs: '116.3', - declared: false, - forfeited: false, - fallOfWicket: [ - { - order: 1, - }, - { - order: 2, - }, - { - order: 3, - }, - { - order: 4, - }, - { - order: 5, - }, - { - order: 6, - }, - { - order: 7, - }, - { - order: 8, - }, - { - order: 9, - }, - { - order: 10, - }, - ], - }, - { - order: 3, - battingTeam: 'England', - runsScored: '120', - overs: '64.2', - declared: false, - forfeited: false, - fallOfWicket: [ - { - order: 1, - }, - { - order: 2, - }, - { - order: 3, - }, - { - order: 4, - }, - { - order: 5, - }, - { - order: 6, - }, - { - order: 7, - }, - { - order: 8, - }, - { - order: 9, - }, - { - order: 10, - }, - ], - }, - { - order: 4, - battingTeam: 'West Indies', - runsScored: '28', - overs: '4.5', - declared: false, - forfeited: false, - fallOfWicket: [], - }, - ], - competitionName: 'Test Match Series', - stage: 'Third Test Match', - venueName: 'National Cricket Stadium', - gameDate: '2022-03-24T14:00:00', - matchId: '0fddabb8-a5ce-eef6-bfbd-e80d1edc7805', + cricketMatch: { + teams: [ + { + name: 'England Women', + id: '18afa423-003e-6925-d490-b1d73e097821', + home: true, + lineup: [ + 'Tammy Beaumont', + 'Maia Bouchier', + 'Heather Knight', + 'Natalie Sciver-Brunt', + 'Alice Capsey', + 'Amy Jones', + 'Mady Villiers', + 'Sophie Ecclestone', + 'Issy Wong', + 'Lauren Bell', + 'Lauren Filer', + ], + teamTagId: 'sport/england-women-cricket-team', + }, + { + name: 'India Women', + id: 'c95ec88c-a172-8594-7f78-a728d287c641', + home: false, + lineup: [ + 'Smriti Mandhana', + 'Shafali Verma', + 'Yastika Bhatia', + 'Harmanpreet Kaur', + 'Jemimah Rodrigues', + 'Richa Ghosh', + 'Deepti Sharma', + 'Sayali Satghare', + 'Sneh Rana', + 'Sree Charani', + 'Kranti Gaud', + ], + }, + ], + innings: [ + { + order: 1, + battingTeam: 'India Women', + runsScored: 285, + wickets: 10, + overs: '74.5', + declared: false, + forfeited: false, + description: 'India Women first innings', + batters: [ + { + name: 'Smriti Mandhana', + order: 1, + ballsFaced: 108, + runs: 83, + fours: 11, + sixes: 1, + out: true, + howOut: 'c Jones b Wong', + onStrike: false, + nonStrike: true, + }, + { + name: 'Shafali Verma', + order: 2, + ballsFaced: 4, + runs: 0, + fours: 0, + sixes: 0, + out: true, + howOut: 'c Jones b Filer', + onStrike: false, + nonStrike: false, + }, + { + name: 'Yastika Bhatia', + order: 3, + ballsFaced: 17, + runs: 12, + fours: 2, + sixes: 0, + out: true, + howOut: 'b Bell', + onStrike: false, + nonStrike: true, + }, + { + name: 'Jemimah Rodrigues', + order: 4, + ballsFaced: 38, + runs: 35, + fours: 5, + sixes: 0, + out: true, + howOut: 'b Wong', + onStrike: false, + nonStrike: true, + }, + { + name: 'Harmanpreet Kaur', + order: 5, + ballsFaced: 121, + runs: 58, + fours: 7, + sixes: 0, + out: true, + howOut: 'b Villiers', + onStrike: false, + nonStrike: true, + }, + { + name: 'Deepti Sharma', + order: 6, + ballsFaced: 87, + runs: 57, + fours: 7, + sixes: 0, + out: true, + howOut: 'c Knight b Ecclestone', + onStrike: false, + nonStrike: true, + }, + { + name: 'Richa Ghosh', + order: 7, + ballsFaced: 12, + runs: 13, + fours: 2, + sixes: 0, + out: true, + howOut: 'c Wong b Filer', + onStrike: false, + nonStrike: true, + }, + { + name: 'Sneh Rana', + order: 8, + ballsFaced: 36, + runs: 13, + fours: 0, + sixes: 0, + out: true, + howOut: 'lbw b Villiers', + onStrike: false, + nonStrike: true, + }, + { + name: 'Sayali Satghare', + order: 9, + ballsFaced: 23, + runs: 1, + fours: 0, + sixes: 0, + out: true, + howOut: 'lbw b Ecclestone', + onStrike: false, + nonStrike: true, + }, + { + name: 'Kranti Gaud', + order: 10, + ballsFaced: 3, + runs: 1, + fours: 0, + sixes: 0, + out: true, + howOut: 'b Ecclestone', + onStrike: false, + nonStrike: true, + }, + { + name: 'Sree Charani', + order: 11, + ballsFaced: 1, + runs: 3, + fours: 0, + sixes: 0, + out: false, + howOut: 'Not Out', + onStrike: false, + nonStrike: true, + }, + ], + bowlers: [ + { + name: 'Lauren Bell', + order: 1, + overs: 9, + maidens: 0, + runs: 50, + wickets: 1, + balls: 54, + }, + { + name: 'Lauren Filer', + order: 2, + overs: 13, + maidens: 1, + runs: 40, + wickets: 2, + balls: 78, + }, + { + name: 'Sophie Ecclestone', + order: 3, + overs: 21, + maidens: 2, + runs: 68, + wickets: 3, + balls: 131, + }, + { + name: 'Issy Wong', + order: 4, + overs: 12, + maidens: 0, + runs: 41, + wickets: 2, + balls: 72, + }, + { + name: 'Mady Villiers', + order: 5, + overs: 19, + maidens: 1, + runs: 79, + wickets: 2, + balls: 114, + }, + ], + fallOfWicket: [ + { + order: 1, + name: 'Shafali Verma', + runs: 4, + }, + { + order: 2, + name: 'Yastika Bhatia', + runs: 37, + }, + { + order: 3, + name: 'Jemimah Rodrigues', + runs: 101, + }, + { + order: 4, + name: 'Smriti Mandhana', + runs: 190, + }, + { + order: 5, + name: 'Harmanpreet Kaur', + runs: 202, + }, + { + order: 6, + name: 'Richa Ghosh', + runs: 229, + }, + { + order: 7, + name: 'Sneh Rana', + runs: 274, + }, + { + order: 8, + name: 'Sayali Satghare', + runs: 279, + }, + { + order: 9, + name: 'Deepti Sharma', + runs: 282, + }, + { + order: 10, + name: 'Kranti Gaud', + runs: 285, + }, + ], + byes: 5, + legByes: 2, + noBalls: 1, + penalties: 0, + wides: 1, + extras: 9, + }, + { + order: 2, + battingTeam: 'England Women', + runsScored: 170, + wickets: 10, + overs: '59.1', + declared: false, + forfeited: false, + description: 'England Women first innings', + batters: [ + { + name: 'Maia Bouchier', + order: 1, + ballsFaced: 52, + runs: 23, + fours: 3, + sixes: 0, + out: true, + howOut: 'c Bhatia b Gaud', + onStrike: false, + nonStrike: true, + }, + { + name: 'Tammy Beaumont', + order: 2, + ballsFaced: 7, + runs: 2, + fours: 0, + sixes: 0, + out: true, + howOut: 'lbw b Gaud', + onStrike: false, + nonStrike: true, + }, + { + name: 'Heather Knight', + order: 3, + ballsFaced: 25, + runs: 6, + fours: 1, + sixes: 0, + out: true, + howOut: 'lbw b Satghare', + onStrike: false, + nonStrike: true, + }, + { + name: 'Natalie Sciver-Brunt', + order: 4, + ballsFaced: 85, + runs: 44, + fours: 4, + sixes: 1, + out: true, + howOut: 'lbw b Gaud', + onStrike: false, + nonStrike: true, + }, + { + name: 'Alice Capsey', + order: 5, + ballsFaced: 13, + runs: 9, + fours: 2, + sixes: 0, + out: true, + howOut: 'b Gaud', + onStrike: false, + nonStrike: true, + }, + { + name: 'Amy Jones', + order: 6, + ballsFaced: 62, + runs: 52, + fours: 6, + sixes: 0, + out: true, + howOut: 'c Ghosh b Rana', + onStrike: false, + nonStrike: true, + }, + { + name: 'Mady Villiers', + order: 7, + ballsFaced: 33, + runs: 10, + fours: 0, + sixes: 0, + out: true, + howOut: 'b Rana', + onStrike: false, + nonStrike: true, + }, + { + name: 'Sophie Ecclestone', + order: 8, + ballsFaced: 22, + runs: 11, + fours: 1, + sixes: 0, + out: true, + howOut: 'c Bhatia b Satghare', + onStrike: false, + nonStrike: true, + }, + { + name: 'Issy Wong', + order: 9, + ballsFaced: 33, + runs: 7, + fours: 1, + sixes: 0, + out: false, + howOut: 'Not Out', + onStrike: false, + nonStrike: true, + }, + { + name: 'Lauren Bell', + order: 10, + ballsFaced: 13, + runs: 3, + fours: 0, + sixes: 0, + out: true, + howOut: 'c Verma b Gaud', + onStrike: false, + nonStrike: true, + }, + { + name: 'Lauren Filer', + order: 11, + ballsFaced: 11, + runs: 0, + fours: 0, + sixes: 0, + out: true, + howOut: 'lbw b Sharma', + onStrike: false, + nonStrike: false, + }, + ], + bowlers: [ + { + name: 'Sayali Satghare', + order: 1, + overs: 13, + maidens: 3, + runs: 40, + wickets: 2, + balls: 78, + }, + { + name: 'Kranti Gaud', + order: 2, + overs: 17, + maidens: 7, + runs: 37, + wickets: 5, + balls: 102, + }, + { + name: 'Sneh Rana', + order: 3, + overs: 14, + maidens: 3, + runs: 41, + wickets: 2, + balls: 83, + }, + { + name: 'Sree Charani', + order: 4, + overs: 8, + maidens: 0, + runs: 41, + wickets: 0, + balls: 48, + }, + { + name: 'Deepti Sharma', + order: 5, + overs: 7, + maidens: 2, + runs: 10, + wickets: 1, + balls: 43, + }, + ], + fallOfWicket: [ + { + order: 1, + name: 'Tammy Beaumont', + runs: 9, + }, + { + order: 2, + name: 'Maia Bouchier', + runs: 32, + }, + { + order: 3, + name: 'Heather Knight', + runs: 32, + }, + { + order: 4, + name: 'Alice Capsey', + runs: 47, + }, + { + order: 5, + name: 'Amy Jones', + runs: 131, + }, + { + order: 6, + name: 'Natalie Sciver-Brunt', + runs: 142, + }, + { + order: 7, + name: 'Sophie Ecclestone', + runs: 159, + }, + { + order: 8, + name: 'Mady Villiers', + runs: 159, + }, + { + order: 9, + name: 'Lauren Bell', + runs: 162, + }, + { + order: 10, + name: 'Lauren Filer', + runs: 170, + }, + ], + byes: 0, + legByes: 1, + noBalls: 2, + penalties: 0, + wides: 0, + extras: 3, + }, + { + order: 3, + battingTeam: 'India Women', + runsScored: 341, + wickets: 7, + overs: '86.3', + declared: false, + forfeited: false, + description: 'India Women second innings', + batters: [ + { + name: 'Smriti Mandhana', + order: 1, + ballsFaced: 130, + runs: 70, + fours: 9, + sixes: 1, + out: true, + howOut: 'c Jones b Bell', + onStrike: false, + nonStrike: true, + }, + { + name: 'Shafali Verma', + order: 2, + ballsFaced: 55, + runs: 33, + fours: 7, + sixes: 0, + out: true, + howOut: 'c Sub b Ecclestone', + onStrike: false, + nonStrike: true, + }, + { + name: 'Yastika Bhatia', + order: 3, + ballsFaced: 158, + runs: 113, + fours: 14, + sixes: 0, + out: true, + howOut: 'c Villiers b Ecclestone', + onStrike: false, + nonStrike: true, + }, + { + name: 'Jemimah Rodrigues', + order: 4, + ballsFaced: 12, + runs: 3, + fours: 0, + sixes: 0, + out: true, + howOut: 'b Bell', + onStrike: false, + nonStrike: true, + }, + { + name: 'Harmanpreet Kaur', + order: 5, + ballsFaced: 34, + runs: 16, + fours: 3, + sixes: 0, + out: true, + howOut: 'lbw b Ecclestone', + onStrike: false, + nonStrike: true, + }, + { + name: 'Deepti Sharma', + order: 6, + ballsFaced: 33, + runs: 10, + fours: 0, + sixes: 0, + out: true, + howOut: 'lbw b Ecclestone', + onStrike: false, + nonStrike: true, + }, + { + name: 'Richa Ghosh', + order: 7, + ballsFaced: 52, + runs: 50, + fours: 8, + sixes: 0, + out: false, + howOut: 'Not Out', + onStrike: false, + nonStrike: true, + }, + { + name: 'Sneh Rana', + order: 8, + ballsFaced: 14, + runs: 1, + fours: 0, + sixes: 0, + out: true, + howOut: 'b Ecclestone', + onStrike: false, + nonStrike: true, + }, + { + name: 'Sayali Satghare', + order: 9, + ballsFaced: 31, + runs: 18, + fours: 4, + sixes: 0, + out: false, + howOut: 'Not Out', + onStrike: true, + nonStrike: true, + }, + { + name: 'Sree Charani', + order: 10, + ballsFaced: 0, + runs: 0, + fours: 0, + sixes: 0, + out: false, + howOut: 'Yet to Bat', + onStrike: false, + nonStrike: false, + }, + { + name: 'Kranti Gaud', + order: 11, + ballsFaced: 0, + runs: 0, + fours: 0, + sixes: 0, + out: false, + howOut: 'Yet to Bat', + onStrike: false, + nonStrike: false, + }, + ], + bowlers: [ + { + name: 'Lauren Bell', + order: 1, + overs: 16, + maidens: 8, + runs: 27, + wickets: 2, + balls: 96, + }, + { + name: 'Lauren Filer', + order: 2, + overs: 12, + maidens: 1, + runs: 61, + wickets: 0, + balls: 72, + }, + { + name: 'Sophie Ecclestone', + order: 3, + overs: 33, + maidens: 4, + runs: 118, + wickets: 5, + balls: 201, + }, + { + name: 'Issy Wong', + order: 4, + overs: 14, + maidens: 3, + runs: 68, + wickets: 0, + balls: 84, + }, + { + name: 'Mady Villiers', + order: 5, + overs: 11, + maidens: 0, + runs: 42, + wickets: 0, + balls: 66, + }, + ], + fallOfWicket: [ + { + order: 1, + name: 'Shafali Verma', + runs: 88, + }, + { + order: 2, + name: 'Smriti Mandhana', + runs: 161, + }, + { + order: 3, + name: 'Jemimah Rodrigues', + runs: 177, + }, + { + order: 4, + name: 'Harmanpreet Kaur', + runs: 212, + }, + { + order: 5, + name: 'Deepti Sharma', + runs: 264, + }, + { + order: 6, + name: 'Yastika Bhatia', + runs: 287, + }, + { + order: 7, + name: 'Sneh Rana', + runs: 299, + }, + ], + byes: 23, + legByes: 2, + noBalls: 0, + penalties: 0, + wides: 2, + extras: 27, + }, + ], + competitionName: "Women's Test Match Series", + stage: "First Women's Test Match", + venueName: "Lord's", + result: 'stumps', + currentDay: 3, + totalDays: 4, + gameDate: '2026-07-10T10:00:00', + officials: [ + 'A Y Harris', + 'S Redfern', + 'J D Middlebrook', + 'G Brown', + 'H Pack', + ], + matchId: '8d5b03ff-0291-c538-b631-ab98e954f3dd', + }, + liveURL: + 'https://www.theguardian.com/sport/live/2026/jul/12/england-v-india-womens-test-day-three-updates-cricket-live', + infoURL: + 'https://www.theguardian.com/sport/cricket/match/2026-07-12/england-women-cricket-team', }; export const match2 = { - teams: [ - { - name: 'West Indies', - home: true, - }, - { - name: 'England', - home: false, - }, - ], - innings: [ - { - order: 1, - battingTeam: 'England', - runsScored: '204', - overs: '89.4', - declared: false, - forfeited: false, - fallOfWicket: [ - { - order: 1, - }, - { - order: 2, - }, - { - order: 3, - }, - { - order: 4, - }, - { - order: 5, - }, - { - order: 6, - }, - { - order: 7, - }, - { - order: 8, - }, - { - order: 9, - }, - { - order: 10, - }, - ], - }, - { - order: 2, - battingTeam: 'West Indies', - runsScored: '297', - overs: '116.3', - declared: false, - forfeited: false, - fallOfWicket: [ - { - order: 1, - }, - { - order: 2, - }, - { - order: 3, - }, - { - order: 4, - }, - { - order: 5, - }, - { - order: 6, - }, - { - order: 7, - }, - { - order: 8, - }, - { - order: 9, - }, - { - order: 10, - }, - ], - }, - { - order: 3, - battingTeam: 'England', - runsScored: '120', - overs: '64.2', - declared: false, - forfeited: false, - fallOfWicket: [ - { - order: 1, - }, - { - order: 2, - }, - { - order: 3, - }, - { - order: 4, - }, - { - order: 5, - }, - { - order: 6, - }, - { - order: 7, - }, - { - order: 8, - }, - { - order: 9, - }, - { - order: 10, - }, - ], - }, - { - order: 4, - battingTeam: 'West Indies', - runsScored: '104', - overs: '25', - declared: false, - forfeited: false, - fallOfWicket: [ - { - order: 8, - }, - { - order: 9, - }, - { - order: 10, - }, - ], - }, - ], - competitionName: 'Test Match Series', - stage: 'Third Test Match', - venueName: 'National Cricket Stadium', - gameDate: '2022-03-24T14:00:00', - matchId: '0fddabb8-a5ce-eef6-bfbd-e80d1edc7805', + ...match1, + cricketMatch: { + ...match1.cricketMatch, + innings: [ + ...match1.cricketMatch.innings, + { + order: 4, + battingTeam: 'England Women', + runsScored: 130, + wickets: 6, + overs: '40.0', + declared: false, + forfeited: false, + description: 'England Women second innings', + batters: [ + { + name: 'Maia Bouchier', + order: 1, + ballsFaced: 8, + runs: 2, + fours: 0, + sixes: 0, + out: true, + howOut: 'lbw b Satghare', + onStrike: false, + nonStrike: true, + }, + { + name: 'Tammy Beaumont', + order: 2, + ballsFaced: 1, + runs: 0, + fours: 0, + sixes: 0, + out: true, + howOut: 'b Gaud', + onStrike: false, + nonStrike: false, + }, + { + name: 'Heather Knight', + order: 3, + ballsFaced: 34, + runs: 13, + fours: 1, + sixes: 0, + out: true, + howOut: 'c Ghosh b Gaud', + onStrike: false, + nonStrike: true, + }, + { + name: 'Natalie Sciver-Brunt', + order: 4, + ballsFaced: 25, + runs: 11, + fours: 2, + sixes: 0, + out: true, + howOut: 'b Rana', + onStrike: false, + nonStrike: true, + }, + { + name: 'Alice Capsey', + order: 5, + ballsFaced: 35, + runs: 21, + fours: 2, + sixes: 0, + out: true, + howOut: 'b Satghare', + onStrike: false, + nonStrike: true, + }, + { + name: 'Amy Jones', + order: 6, + ballsFaced: 72, + runs: 52, + fours: 6, + sixes: 0, + out: false, + howOut: 'Not Out', + onStrike: false, + nonStrike: true, + }, + { + name: 'Mady Villiers', + order: 7, + ballsFaced: 63, + runs: 26, + fours: 3, + sixes: 0, + out: true, + howOut: 'c Ghosh b Rana', + onStrike: false, + nonStrike: true, + }, + { + name: 'Sophie Ecclestone', + order: 8, + ballsFaced: 2, + runs: 1, + fours: 0, + sixes: 0, + out: false, + howOut: 'Not Out', + onStrike: true, + nonStrike: true, + }, + { + name: 'Issy Wong', + order: 9, + ballsFaced: 0, + runs: 0, + fours: 0, + sixes: 0, + out: false, + howOut: 'Yet to Bat', + onStrike: false, + nonStrike: false, + }, + { + name: 'Lauren Bell', + order: 10, + ballsFaced: 0, + runs: 0, + fours: 0, + sixes: 0, + out: false, + howOut: 'Yet to Bat', + onStrike: false, + nonStrike: false, + }, + { + name: 'Lauren Filer', + order: 11, + ballsFaced: 0, + runs: 0, + fours: 0, + sixes: 0, + out: false, + howOut: 'Yet to Bat', + onStrike: false, + nonStrike: false, + }, + ], + bowlers: [ + { + name: 'Sayali Satghare', + order: 1, + overs: 8, + maidens: 2, + runs: 19, + wickets: 2, + balls: 48, + }, + { + name: 'Kranti Gaud', + order: 2, + overs: 8, + maidens: 0, + runs: 40, + wickets: 2, + balls: 48, + }, + { + name: 'Sneh Rana', + order: 3, + overs: 11, + maidens: 2, + runs: 33, + wickets: 2, + balls: 66, + }, + { + name: 'Sree Charani', + order: 4, + overs: 5, + maidens: 0, + runs: 17, + wickets: 0, + balls: 30, + }, + { + name: 'Deepti Sharma', + order: 5, + overs: 7, + maidens: 0, + runs: 16, + wickets: 0, + balls: 42, + }, + { + name: 'Shafali Verma', + order: 6, + overs: 1, + maidens: 0, + runs: 1, + wickets: 0, + balls: 6, + }, + ], + fallOfWicket: [ + { + order: 1, + name: 'Tammy Beaumont', + runs: 2, + }, + { + order: 2, + name: 'Maia Bouchier', + runs: 6, + }, + { + order: 3, + name: 'Natalie Sciver-Brunt', + runs: 23, + }, + { + order: 4, + name: 'Heather Knight', + runs: 34, + }, + { + order: 5, + name: 'Alice Capsey', + runs: 59, + }, + { + order: 6, + name: 'Mady Villiers', + runs: 126, + }, + ], + byes: 0, + legByes: 4, + noBalls: 0, + penalties: 0, + wides: 0, + extras: 4, + }, + ], + }, }; diff --git a/dotcom-rendering/playwright/tests/liveblog.interactivity.e2e.spec.ts b/dotcom-rendering/playwright/tests/liveblog.interactivity.e2e.spec.ts index 964d46ae4a3..224b8c511a5 100644 --- a/dotcom-rendering/playwright/tests/liveblog.interactivity.e2e.spec.ts +++ b/dotcom-rendering/playwright/tests/liveblog.interactivity.e2e.spec.ts @@ -123,6 +123,8 @@ test.describe('Liveblogs', () => { test('should enhance tweets after they have been inserted', async ({ page, }) => { + await page.clock.install(); + await loadPage({ page, path: `/Article/${blogUrl}`, @@ -154,9 +156,10 @@ test.describe('Liveblogs', () => { const twitterIframe = getIframeBody(page, tweetIframeSelector); + await page.clock.runFor(20_000); + await expect(await twitterIframe).toContainText( 'Don’t believe the spin. Once you break through typical Washington math', - { timeout: 20000 }, ); }); @@ -248,6 +251,8 @@ test.describe('Liveblogs', () => { test('should initially hide new blocks, only revealing them when the top of blog is in view', async ({ page, }) => { + await page.clock.install(); + await loadPage({ page, path: `/Article/${blogUrl}`, @@ -284,9 +289,10 @@ test.describe('Liveblogs', () => { const twitterIframe = getIframeBody(page, tweetIframeSelector); + await page.clock.runFor(20_000); + await expect(await twitterIframe).toContainText( 'Don’t believe the spin. Once you break through typical Washington math', - { timeout: 20000 }, ); }); @@ -295,44 +301,42 @@ test.describe('Liveblogs', () => { }) => { const update1ResponsePromise = stubResponse( page, - /england-cricket-team\.json/, + /england-women-cricket-team\.json/, { status: 200, - json: { - scorecardUrl: '/test', - match: match1, - }, + json: match1, }, ); + await page.clock.install(); + await loadPage({ page, - path: `/Article/https://theguardian.com/sport/live/2022/mar/27/west-indies-v-england-third-test-day-four-live`, + path: `/Article/https://www.theguardian.com/sport/live/2026/jul/12/england-v-india-womens-test-day-three-updates-cricket-live`, queryParams: { live: 'true', }, }); - await waitForIsland(page, 'Liveness', { waitFor: 'attached' }); - await update1ResponsePromise; + await waitForIsland(page, 'CricketMatchHeaderWrapper', { + waitFor: 'attached', + }); - await expect(page.getByText('297 & 28 - 0 (4.5 overs)')).toBeVisible(); + await update1ResponsePromise; await expect( - page.getByText('204 & 120 all out (64.2 overs)'), + page.getByLabel('341 runs, 7 wickets fallen'), ).toBeVisible(); - await stubResponse(page, /england-cricket-team\.json/, { + await stubResponse(page, /england-women-cricket-team\.json/, { status: 200, - json: { - scorecardUrl: '/test', - match: match2, - }, + json: match2, }); - // The cricket data is updated every 14 seconds, so we need a longer timeout here - await expect(page.getByText('297 & 104 - 3 (25 overs)')).toBeVisible({ - timeout: 30000, - }); + await page.clock.runFor(60_000); + + await expect( + page.getByLabel('130 runs, 6 wickets fallen'), + ).toBeVisible(); }); }); diff --git a/dotcom-rendering/src/components/CricketMatchHeader/CricketMatchHeader.tsx b/dotcom-rendering/src/components/CricketMatchHeader/CricketMatchHeader.tsx index aeab8e10d98..2135b4e347b 100644 --- a/dotcom-rendering/src/components/CricketMatchHeader/CricketMatchHeader.tsx +++ b/dotcom-rendering/src/components/CricketMatchHeader/CricketMatchHeader.tsx @@ -205,6 +205,7 @@ const fetcher = getHeaderData(url) .then(parseHeaderData(selectedTab, currentUrl)) .then((result) => { + console.log('CricketMatchHeader fetcher result', result); if (!result.ok) { log('dotcom', result.error); throw new Error(); diff --git a/dotcom-rendering/src/components/CricketScoreboard.stories.tsx b/dotcom-rendering/src/components/CricketScoreboard.stories.tsx deleted file mode 100644 index 56f3861dde3..00000000000 --- a/dotcom-rendering/src/components/CricketScoreboard.stories.tsx +++ /dev/null @@ -1,22 +0,0 @@ -import { breakpoints } from '@guardian/source/foundations'; -import preview from '../../.storybook/preview'; -import { match } from '../../fixtures/manual/cricket-scoreboard'; -import { CricketScoreboard } from './CricketScoreboard'; - -const meta = preview.meta({ - component: CricketScoreboard, - title: 'Components/CricketScoreboard', - parameters: { - chromatic: { - viewports: [breakpoints.mobileLandscape], - }, - }, -}); - -export const defaultStory = meta.story({ - name: 'Cricket Scoreboard', - args: { - match, - scorecardUrl: '/test', - }, -}); diff --git a/dotcom-rendering/src/components/CricketScoreboard.test.tsx b/dotcom-rendering/src/components/CricketScoreboard.test.tsx deleted file mode 100644 index 8f01d3fbf28..00000000000 --- a/dotcom-rendering/src/components/CricketScoreboard.test.tsx +++ /dev/null @@ -1,151 +0,0 @@ -import { render } from '@testing-library/react'; -import type { CricketInnings, CricketMatch } from '../types/sport'; -import { CricketInningsScores, cricketScore } from './CricketScoreboard'; - -const defaultInnings: CricketInnings = { - order: 0, - battingTeam: 'Test Team', - runsScored: '26', - declared: false, - forfeited: false, - fallOfWicket: [{ order: 0 }, { order: 1 }, { order: 2 }], - overs: '10.5', -}; - -const defaultMatch: CricketMatch = { - matchId: 'test', - competitionName: 'test match series', - stage: 'test match', - venueName: 'venue', - gameDate: '2021-06-30T14:00:00', - teams: [ - { - name: 'Test Team 1', - home: true, - }, - { - name: 'Test Team 2', - home: false, - }, - ], - innings: [], -}; - -describe('CricketScoreboard', () => { - describe('cricketScore', () => { - it('Should create the score for a declared innings', () => { - const innings: CricketInnings = { - ...defaultInnings, - declared: true, - }; - - expect(cricketScore({ innings })).toEqual('26 - 3 declared'); - }); - it('Should create the score for a foreited innings', () => { - const innings: CricketInnings = { - ...defaultInnings, - forfeited: true, - }; - - expect(cricketScore({ innings })).toEqual('26 - 3 forfeited'); - }); - it('Should create the score for an all out innings', () => { - const innings: CricketInnings = { - ...defaultInnings, - fallOfWicket: [ - { order: 0 }, - { order: 1 }, - { order: 2 }, - { order: 3 }, - { order: 4 }, - { order: 5 }, - { order: 6 }, - { order: 7 }, - { order: 8 }, - { order: 9 }, - ], - }; - - expect(cricketScore({ innings })).toEqual('26 all out'); - expect(cricketScore({ innings, short: true })).toEqual('26'); - }); - it('Should create the score for an ongoing innings', () => { - const innings: CricketInnings = { - order: 0, - battingTeam: 'Test Team', - runsScored: '26', - declared: false, - forfeited: false, - fallOfWicket: [{ order: 0 }, { order: 1 }, { order: 2 }], - overs: '10.5', - }; - - expect(cricketScore({ innings })).toEqual('26 - 3'); - }); - }); - describe('CricketInnings component', () => { - it('Renders a match with 1 innings for a team', () => { - const match: CricketMatch = { - ...defaultMatch, - innings: [ - // Team 1 innings all out - { - ...defaultInnings, - battingTeam: 'Test Team 1', - fallOfWicket: [ - { order: 0 }, - { order: 1 }, - { order: 2 }, - { order: 3 }, - { order: 4 }, - { order: 5 }, - { order: 6 }, - { order: 7 }, - { order: 8 }, - { order: 9 }, - ], - }, - ], - }; - const { getByText } = render( - , - ); - expect(getByText('26 all out (10.5 overs)')).toBeInTheDocument(); - }); - it('Renders a match with 2 innings for a team', () => { - const match: CricketMatch = { - ...defaultMatch, - innings: [ - // Team 1 innings all out - { - ...defaultInnings, - battingTeam: 'Test Team 1', - fallOfWicket: [ - { order: 0 }, - { order: 1 }, - { order: 2 }, - { order: 3 }, - { order: 4 }, - { order: 5 }, - { order: 6 }, - { order: 7 }, - { order: 8 }, - { order: 9 }, - ], - }, - { - ...defaultInnings, - battingTeam: 'Test Team 1', - forfeited: true, - }, - ], - }; - const { getByText } = render( - , - ); - expect( - getByText('26 & 26 - 3 forfeited (10.5 overs)'), - ).toBeInTheDocument(); - }); - }); -}); diff --git a/dotcom-rendering/src/components/CricketScoreboard.tsx b/dotcom-rendering/src/components/CricketScoreboard.tsx deleted file mode 100644 index 50dc9255ca7..00000000000 --- a/dotcom-rendering/src/components/CricketScoreboard.tsx +++ /dev/null @@ -1,191 +0,0 @@ -import { css } from '@emotion/react'; -import { - between, - space, - textSans14, - until, -} from '@guardian/source/foundations'; -import { palette } from '../palette'; -import type { CricketInnings, CricketMatch } from '../types/sport'; -import { DateTime } from './DateTime'; - -const ALL_OUT_WICKETS = 10; - -type Props = { - scorecardUrl: string; - match: CricketMatch; -}; - -const screenReaderOnlyStyle = css` - border: 0; - clip: rect(0 0 0 0); - height: 1px; - margin: -1px; - overflow: hidden; - padding: 0; - position: absolute; - width: 1px; -`; - -const containerStyle = css` - ${until.mobileLandscape} { - padding: 10px 10px 0 10px; - } - ${between.mobileLandscape.and.desktop} { - padding: 10px 20px 0 20px; - } -`; - -const tableStyle = css` - width: 100%; - ${textSans14} -`; - -const captionStyle = css` - text-align: left; - font-weight: bold; - border-top: 1px solid ${palette('--cricket-scoreboard-border-top')}; - border-collapse: inherit; - padding-top: ${space[2]}px; - padding-bottom: ${space[2]}px; -`; - -const rowStyle = css` - border-top: 1px solid ${palette('--cricket-scoreboard-divider')}; -`; - -const cellStyle = css` - padding-top: ${space[3]}px; - padding-bottom: ${space[3]}px; -`; - -const boldStlye = css` - font-weight: bold; -`; - -const linkPaddingStlye = css` - padding-top: ${space[3]}px; - padding-bottom: ${space[2]}px; -`; - -const linkStyle = css` - color: ${palette('--cricket-scoreboard-link-text')}; - text-decoration: none; - - :hover { - color: ${palette('--cricket-scoreboard-link-text')}; - text-decoration: underline; - } -`; - -export const cricketScore = ({ - innings, - short, -}: { - innings: CricketInnings; - short?: boolean; -}): string => { - if (innings.declared) { - return `${innings.runsScored} - ${innings.fallOfWicket.length} declared`; - } - if (innings.forfeited) { - return `${innings.runsScored} - ${innings.fallOfWicket.length} forfeited`; - } - if (innings.fallOfWicket.length === ALL_OUT_WICKETS) { - return short ? innings.runsScored : `${innings.runsScored} all out`; - } - return `${innings.runsScored} - ${innings.fallOfWicket.length}`; -}; - -export const CricketInningsScores = ({ - match, - home, -}: { - match: CricketMatch; - home: boolean; -}) => { - const teamName = match.teams.find((team) => team.home === home)?.name; - const teamInnings = match.innings.filter( - (innings) => innings.battingTeam === teamName, - ); - - // There can be up to 2 innings per team in a cricket match - const [one, two] = teamInnings; - - if (one && two) { - return ( -

- {cricketScore({ innings: one, short: true })} - {' & '} - {cricketScore({ innings: two })} ({two.overs} overs) -

- ); - } - - if (one) { - return ( -

- {cricketScore({ innings: one })} ({one.overs} overs) -

- ); - } - - return

Yet to bat

; -}; - -export const CricketScoreboard = ({ scorecardUrl, match }: Props) => { - const date = new Date(match.gameDate); - return ( -
-

- - {match.stage}, {match.venueName} -

- - - - - - - - - {/* Home team */} - - - - - {/* Away team */} - - - - - - - - - - - -
Team nameScore
- {match.teams.find((team) => !!team.home)?.name} - - -
- {match.teams.find((team) => !team.home)?.name} - - -
- {match.stage}, {match.venueName} -
- - View full scorecard - -
-
- ); -}; diff --git a/dotcom-rendering/src/components/GetCricketScoreboard.island.tsx b/dotcom-rendering/src/components/GetCricketScoreboard.island.tsx deleted file mode 100644 index 49f4bb1da6e..00000000000 --- a/dotcom-rendering/src/components/GetCricketScoreboard.island.tsx +++ /dev/null @@ -1,48 +0,0 @@ -import type { SWRConfiguration } from 'swr'; -import { ArticleDesign, type ArticleFormat } from '../lib/articleFormat'; -import { useApi } from '../lib/useApi'; -import type { CricketMatch } from '../types/sport'; -import { CricketScoreboard } from './CricketScoreboard'; -import { Placeholder } from './Placeholder'; - -type Props = { - matchUrl: string; - format: ArticleFormat; -}; - -const Loading = () => ; - -export const GetCricketScoreboard = ({ matchUrl, format }: Props) => { - const options: SWRConfiguration = { - errorRetryCount: 1, - }; - // If this blog is live then poll for new stats - if (format.design === ArticleDesign.LiveBlog) { - options.refreshInterval = 14_000; - } - - const { data, error, loading } = useApi<{ - match: CricketMatch; - scorecardUrl: string; - }>(matchUrl, options); - - if (loading) { - return ; - } - if (error) { - // Send the error to Sentry and then prevent the element from rendering - window.guardian.modules.sentry.reportError(error, 'cricket-scoreboard'); - - return null; - } - if (data?.match.matchId) { - return ( - - ); - } - - return null; -}; diff --git a/dotcom-rendering/src/layouts/LiveLayout.tsx b/dotcom-rendering/src/layouts/LiveLayout.tsx index 5887c0c2496..8fc73c9cc23 100644 --- a/dotcom-rendering/src/layouts/LiveLayout.tsx +++ b/dotcom-rendering/src/layouts/LiveLayout.tsx @@ -27,7 +27,6 @@ import { DiscussionLayout } from '../components/DiscussionLayout'; import { FootballMatchHeaderWrapper } from '../components/FootballMatchHeaderWrapper.island'; import { FootballMiniMatchStatsWrapper } from '../components/FootballMiniMatchStatsWrapper.island'; import { Footer } from '../components/Footer'; -import { GetCricketScoreboard } from '../components/GetCricketScoreboard.island'; import { GridItem } from '../components/GridItem'; import { HeaderAdSlot } from '../components/HeaderAdSlot'; import { Island } from '../components/Island'; @@ -52,7 +51,6 @@ import { canRenderAds } from '../lib/canRenderAds'; import { getContributionsServiceUrl } from '../lib/contributions'; import { decideStoryPackageTrails } from '../lib/decideTrail'; import { getZIndex } from '../lib/getZIndex'; -import { useAB } from '../lib/useAB'; import { worldCupTagId } from '../lib/worldCup2026'; import type { NavType } from '../model/extract-nav'; import { palette as themePalette } from '../palette'; @@ -270,11 +268,6 @@ export const LiveLayout = (props: WebProps | AppsProps) => { config: { isPaidContent, host, hasLiveBlogTopAd, hasSurveyAd }, } = article; - const ab = useAB(); - const isCricketRedesignEnabled = Boolean( - ab?.isUserInTestGroup('webx-cricket-redesign', 'enable'), - ); - // TODO: // 1) Read 'forceEpic' value from URL parameter and use it to force the slot to render // 2) Otherwise, ensure slot only renders if `article.config.shouldHideReaderRevenue` equals false. @@ -299,9 +292,6 @@ export const LiveLayout = (props: WebProps | AppsProps) => { ? article.matchStatsUrl : undefined; - const cricketMatchUrl = - article.matchType === 'CricketMatchType' ? article.matchUrl : undefined; - const cricketMatchStatsUrl = article.matchType === 'CricketMatchType' ? article.matchStatsUrl @@ -395,7 +385,6 @@ export const LiveLayout = (props: WebProps | AppsProps) => { format={format} article={article} liveBlogAreaId={liveBlogAreaId} - isCricketRedesignEnabled={isCricketRedesignEnabled} /> {/* This element is used to replace the liveblog with the scorecard when the scorecard tab is clicked */} @@ -598,20 +587,6 @@ export const LiveLayout = (props: WebProps | AppsProps) => {
- {!!cricketMatchUrl && - !isCricketRedesignEnabled && ( - - - - )} { cricketMatchStatsUrl={ cricketMatchStatsUrl } - isCricketRedesignEnabled={ - isCricketRedesignEnabled - } + renderingTarget={renderingTarget} /> @@ -1139,8 +1112,10 @@ export const LiveLayout = (props: WebProps | AppsProps) => { const MiniMatchStats = (props: { footballMatchStatsUrl: string | undefined; cricketMatchStatsUrl: string | undefined; - isCricketRedesignEnabled: boolean; + renderingTarget: RenderingTarget; }) => { + const isApps = props.renderingTarget === 'Apps'; + if (props.footballMatchStatsUrl) { return ( @@ -1151,7 +1126,7 @@ const MiniMatchStats = (props: { ); } - if (props.cricketMatchStatsUrl && props.isCricketRedesignEnabled) { + if (!isApps && props.cricketMatchStatsUrl) { return ( { const footballMatchLeagueName = props.article.sectionLabel; const footballMatchLeagueUrl = `${props.article.guardianBaseURL}/${props.article.sectionUrl}`; @@ -1209,7 +1183,7 @@ const Header = (props: { ); } - if (!isApps && cricketMatchHeaderUrl && props.isCricketRedesignEnabled) { + if (!isApps && cricketMatchHeaderUrl) { return ( <>