diff --git a/projects/stream-chat-angular/src/lib/attachment-list/attachment-list.component.spec.ts b/projects/stream-chat-angular/src/lib/attachment-list/attachment-list.component.spec.ts
index 99615b41..68942e4b 100644
--- a/projects/stream-chat-angular/src/lib/attachment-list/attachment-list.component.spec.ts
+++ b/projects/stream-chat-angular/src/lib/attachment-list/attachment-list.component.spec.ts
@@ -47,6 +47,7 @@ describe('AttachmentListComponent', () => {
let queryGallery: () => HTMLElement | null;
let queryVideos: () => HTMLVideoElement[];
let queryVideoContainers: () => HTMLElement[];
+ let queryScrapedVideos: () => HTMLLinkElement[];
let sendAction: jasmine.Spy;
beforeEach(async () => {
@@ -130,6 +131,10 @@ describe('AttachmentListComponent', () => {
'[data-testclass="video-attachment-parent"]'
)
);
+ queryScrapedVideos = () =>
+ Array.from(
+ nativeElement.querySelectorAll('[data-testclass=scraped-video]')
+ );
}));
it('should display received #attachments ordered', () => {
@@ -205,6 +210,48 @@ describe('AttachmentListComponent', () => {
expect(component.orderedAttachments.length).toBe(1);
});
+ it('should display scraped videos', () => {
+ const scrapedVideoAttachments = [
+ {
+ type: 'video',
+ author_name: 'YouTube',
+ title: 'Rachmaninoff - Prelude in C Sharp Minor (Op. 3 No. 2)',
+ title_link: 'https://www.youtube.com/watch?v=sCtixpIWBto',
+ text: 'Rachmaninoff - Prelude in C Sharp Minor (Op. 3 No. 2) Click the 🔔bell to always be notified on new uploads! ♫ Listen on Spotify: http://spoti.fi/2LdpqK7 ♫ MI...',
+ image_url: 'https://i.ytimg.com/vi/sCtixpIWBto/maxresdefault.jpg',
+ thumb_url: 'https://i.ytimg.com/vi/sCtixpIWBto/maxresdefault.jpg',
+ asset_url: 'https://www.youtube.com/embed/sCtixpIWBto',
+ og_scrape_url: 'https://www.youtube.com/watch?v=sCtixpIWBto',
+ },
+ {
+ type: 'video',
+ author_name: 'Twitch',
+ title: 'ledo_drito - Twitch',
+ title_link: 'https://www.twitch.tv/ledo_drito',
+ text: 'GG',
+ image_url:
+ 'https://static-cdn.jtvnw.net/jtv_user_pictures/ae659572-9c29-4f91-867f-d7de167b982f-profile_image-300x300.png',
+ thumb_url:
+ 'https://static-cdn.jtvnw.net/jtv_user_pictures/ae659572-9c29-4f91-867f-d7de167b982f-profile_image-300x300.png',
+ asset_url:
+ 'https://player.twitch.tv/?channel=ledo_drito&player=facebook&autoplay=true&parent=meta.tag',
+ og_scrape_url: 'https://www.twitch.tv/ledo_drito',
+ },
+ ];
+
+ component.attachments = scrapedVideoAttachments;
+ component.ngOnChanges({ attachments: {} as SimpleChange });
+ fixture.detectChanges();
+
+ const scrapedVideos = queryScrapedVideos();
+
+ expect(scrapedVideos.length).toBe(2);
+
+ scrapedVideos.forEach((video, index) => {
+ expect(video.href).toBe(scrapedVideoAttachments[index].og_scrape_url);
+ });
+ });
+
it('should display voice recording', () => {
component.attachments = [mockVoiceRecording];
component.ngOnChanges({ attachments: {} as SimpleChange });
diff --git a/projects/stream-chat-angular/src/lib/attachment-list/attachment-list.component.ts b/projects/stream-chat-angular/src/lib/attachment-list/attachment-list.component.ts
index 3ce94f68..85becae4 100644
--- a/projects/stream-chat-angular/src/lib/attachment-list/attachment-list.component.ts
+++ b/projects/stream-chat-angular/src/lib/attachment-list/attachment-list.component.ts
@@ -152,7 +152,7 @@ export class AttachmentListComponent implements OnChanges, OnInit, OnDestroy {
return (
attachment.type === 'video' &&
attachment.asset_url &&
- !attachment.og_scrape_url // links from video share services (such as YouTube or Facebook) are can't be played
+ !attachment.og_scrape_url
);
}
@@ -160,7 +160,8 @@ export class AttachmentListComponent implements OnChanges, OnInit, OnDestroy {
return (
!attachment.type ||
(attachment.type === 'image' && !this.isImage(attachment)) ||
- attachment.type === 'giphy'
+ attachment.type === 'giphy' ||
+ (attachment.type === 'video' && attachment.og_scrape_url)
);
}