diff --git a/src/__story__/youtube.story.tsx b/src/__story__/youtube.story.tsx index 2a6a135e0..edde5b3b2 100644 --- a/src/__story__/youtube.story.tsx +++ b/src/__story__/youtube.story.tsx @@ -13,4 +13,11 @@ storiesOf('youtube', module) ); + }) + .add('Shortened URL', () => { + return ( + + + + ); }); diff --git a/src/routeToBlock.ts b/src/routeToBlock.ts index f38d7e33d..c5dbfa352 100644 --- a/src/routeToBlock.ts +++ b/src/routeToBlock.ts @@ -7,10 +7,16 @@ const routeTwitter: ReactEmbedRouter = (blocks, {pathname}) => { return [blocks.tweet, steps[steps.length - 1]]; }; -const routeYouTube: ReactEmbedRouter = (blocks, {search}) => { - const matches = search.match(/v=([^\&]+)(&|$)/); - if (!matches) return undefined; - return [blocks.youtube, matches[1]]; +const routeYouTube: ReactEmbedRouter = (blocks, parsed) => { + const searchMatch = parsed.search.match(/v=([^\&]+)(&|$)/); + const urlMatch = parsed.pathname.replace('/', ''); + if (searchMatch) { + return [blocks.youtube, searchMatch[1]]; + } else if (urlMatch) { + return [blocks.youtube, urlMatch]; + } else { + return undefined; + } }; const routeJsFiddle: ReactEmbedRouter = (blocks, {pathname}) => { @@ -56,11 +62,11 @@ const routeGfycat: ReactEmbedRouter = (blocks, {pathname}) => { const routeToBlock: ReactEmbedRouter = (blocks: Blocks, parsed: ParsedUrl) => { const {hostname, url} = parsed; - switch (hostname) { case 'twitter.com': return routeTwitter(blocks, parsed); case 'www.youtube.com': + case 'youtu.be': case 'youtube.com': return routeYouTube(blocks, parsed); case 'soundcloud.com':