Filter out subtitles asset type

Author: Fweddi

apps-rendering/src/atoms.test.ts

@@ -653,6 +653,7 @@ describe('parseAtom', () => {
 		let atoms: Atoms;
 		let media: Atom;
 		let mediaAtom: MediaAtom;
+		const assetVersion = new Int64(1);
 
 		beforeEach(() => {
 			blockElement.contentAtomTypeData = {
@@ -662,10 +663,16 @@ describe('parseAtom', () => {
 			mediaAtom = {
 				title: '',
 				assets: [
+					{
+						assetType: AssetType.SUBTITLES,
+						id: 'subtitles-asset-id',
+						version: assetVersion,
+						platform: Platform.YOUTUBE,
+					},
 					{
 						assetType: AssetType.VIDEO,
-						id: 'asset-id',
-						version: new Int64(1),
+						id: 'video-asset-id',
+						version: assetVersion,
 						platform: Platform.YOUTUBE,
 					},
 				],
@@ -726,7 +733,7 @@ describe('parseAtom', () => {
 					posterUrl: 'poster-url',
 					caption: some(frag),
 					duration: some(1000),
-					videoId: 'asset-id',
+					videoId: 'video-asset-id',
 					id: atomId,
 					title: '',
 				}),

apps-rendering/src/atoms.ts

@@ -8,6 +8,8 @@ import { isValidDate } from 'date';
 import type { Int64 } from 'thrift';
 import type { DocParser } from 'parserContext';
 import { Result } from 'result';
+import type { MediaAtom } from '@guardian/content-atom-model/media/mediaAtom';
+import { AssetType } from '@guardian/content-atom-model/media/assetType';
 
 interface TimelineEvent {
 	title: string;
@@ -248,9 +250,13 @@ function parseAtom(
 				return Result.err(`No atom matched this id: ${id}`);
 			}
 
+			const mediaAtom: MediaAtom = atom.data.media;
 			const { posterUrl, duration, assets, activeVersion, title } =
-				atom.data.media;
-			const videoId = assets.find(
+				mediaAtom;
+			const videoAssets = assets.filter(
+				(asset) => asset.assetType === AssetType.VIDEO,
+			);
+			const videoId = videoAssets.find(
 				(asset) =>
 					asset.version.toNumber() === activeVersion?.toNumber(),
 			)?.id;

apps-rendering/src/video.test.ts

@@ -22,7 +22,8 @@ describe('parseVideo', () => {
 	let mediaAtom: MediaAtom;
 	const atomId = 'atomId2';
 	const posterUrl = 'poster-url';
-	const assetId = 'asset-id';
+	const videoAssetId = 'video-asset-id';
+	const subtitlesAssetId = 'subtitles-asset-id';
 	const mediaAtomTitle = 'mediaTitle';
 	const assetVersion = new Int64(2);
 
@@ -43,9 +44,15 @@ describe('parseVideo', () => {
 
 		mediaAtom = {
 			assets: [
+				{
+					assetType: AssetType.SUBTITLES,
+					id: subtitlesAssetId,
+					version: assetVersion,
+					platform: Platform.YOUTUBE,
+				},
 				{
 					assetType: AssetType.VIDEO,
-					id: assetId,
+					id: videoAssetId,
 					version: assetVersion,
 					platform: Platform.YOUTUBE,
 				},
@@ -79,7 +86,7 @@ describe('parseVideo', () => {
 	test('returns video', () => {
 		const expected = Optional.some({
 			posterUrl: posterUrl,
-			videoId: assetId,
+			videoId: videoAssetId,
 			duration: undefined,
 			atomId: atomId,
 			title: mediaAtomTitle,

apps-rendering/src/video.ts

@@ -1,6 +1,8 @@
 import type { Atoms } from '@guardian/content-api-models/v1/atoms';
 import type { BlockElement } from '@guardian/content-api-models/v1/blockElement';
 import { Optional } from 'optional';
+import type { MediaAtom } from '@guardian/content-atom-model/media/mediaAtom';
+import { AssetType } from '@guardian/content-atom-model/media/assetType';
 
 interface Video {
 	posterUrl: string;
@@ -23,10 +25,12 @@ const parseVideo =
 		if (atom?.data.kind !== 'media') {
 			return Optional.none();
 		}
-
-		const { posterUrl, duration, assets, activeVersion, title } =
-			atom.data.media;
-		const videoId = assets.find(
+		const mediaAtom: MediaAtom = atom.data.media;
+		const { posterUrl, duration, assets, activeVersion, title } = mediaAtom;
+		const videoAssets = assets.filter(
+			(asset) => asset.assetType === AssetType.VIDEO,
+		);
+		const videoId = videoAssets.find(
 			(asset) => asset.version.toNumber() === activeVersion?.toNumber(),
 		)?.id;
 

dotcom-rendering/src/model/enhanceCards.test.ts

@@ -5,6 +5,13 @@ describe('Enhance Cards', () => {
 	it('filters out m3u8 assets until supported by DCR', () => {
 		const videoReplace = true;
 		const assets: FEMediaAsset[] = [
+			{
+				id: 'https://guim-example.co.uk/atomID-1.vtt',
+				version: 1,
+				platform: 'Url',
+				mimeType: 'text/vtt',
+				assetType: 'Subtitles',
+			},
 			{
 				id: 'https://guim-example.co.uk/atomID-1.m3u8',
 				version: 1,

dotcom-rendering/src/model/enhanceCards.ts

@@ -200,6 +200,7 @@ export const getActiveMediaAtom = (
 	if (mediaAtom) {
 		const m3u8MimeType = 'application/vnd.apple.mpegurl';
 		const asset = mediaAtom.assets
+			.filter((_) => _.assetType === 'Video')
 			// filter out m3u8 assets, as these are not yet supported by DCR
 			.filter((_) => _.mimeType !== m3u8MimeType)
 			.find(({ version }) => version === mediaAtom.activeVersion);