diff --git a/README.md b/README.md index 05e52565..87635921 100644 --- a/README.md +++ b/README.md @@ -60,6 +60,7 @@ empty lines) and replace it with the proper embed-code. - [Twitch](#twitch) - [Twitter](#twitter) - [YouTube](#youtube) + - [GoogleSlides](#google-slides) - [Options](#options) - [customTransformers](#customtransformers) - [Properties](#properties) @@ -639,6 +640,32 @@ https://youtu.be/dQw4w9WgXcQ +### Google slides + +#### Usage + +```md +https://docs.google.com/presentation/d/e/2PACX-1vQfksLBuIJX8qNyFEQh54SgB2_9x4xulcUaHtnXoTpP55NAMFIOqnK-5lFhbhQJPrnIZfgqeSg3ssNu/pub?start=false&loop=false&delayms=3000 +``` + +
+Result + +```html + +``` + +
+ ## Options ### customTransformers diff --git a/package.json b/package.json index 496c71f9..fc41be28 100644 --- a/package.json +++ b/package.json @@ -22,7 +22,8 @@ "streamable", "twitch", "twitter", - "youtube" + "youtube", + "google-slides" ], "author": "Michaël De Boey (https://michaeldeboey.be)", "license": "MIT", diff --git a/src/__tests__/__fixtures__/kitchensink.md b/src/__tests__/__fixtures__/kitchensink.md index 1ee9b5c5..230d5b8b 100644 --- a/src/__tests__/__fixtures__/kitchensink.md +++ b/src/__tests__/__fixtures__/kitchensink.md @@ -42,3 +42,5 @@ https://twitch.tv/videos/546761743 https://twitter.com/kentcdodds/status/1078755736455278592 https://youtu.be/dQw4w9WgXcQ + +https://docs.google.com/presentation/d/e/2PACX-1vR8apkUGyfetdVcF226v6fLMrPspWUlrOYFBFRceHjD_pVgXFFp1Ee1lfsOlUYeMnvMh5DrRT-InOE5/pub?start=false&loop=false&delayms=3000 diff --git a/src/__tests__/plugin.js b/src/__tests__/plugin.js index eee3915a..3e48b5e7 100644 --- a/src/__tests__/plugin.js +++ b/src/__tests__/plugin.js @@ -20,6 +20,7 @@ describe('gatsby-remark-embedder', () => { 'https://instagram.com/p/B60jPE6J8U-': `

example

A post shared by Michaël De Boey (@michaeldeboey) onJan 2, 2020 at 6:45am PST

`, 'https://streamable.com/moo': ``, 'https://twitter.com/kentcdodds/status/1078755736455278592': `

example

— Kent C. Dodds (@kentcdodds) December 28, 2018
`, + 'https://docs.google.com/presentation/d/e/2PACX-1vR8apkUGyfetdVcF226v6fLMrPspWUlrOYFBFRceHjD_pVgXFFp1Ee1lfsOlUYeMnvMh5DrRT-InOE5/pub?start=false&loop=false&delayms=3000': ``, }); const markdownAST = getMarkdownASTForFile('kitchensink', true); @@ -70,6 +71,8 @@ describe('gatsby-remark-embedder', () => {

example

— Kent C. Dodds (@kentcdodds) December 28, 2018
+ + " `); }); @@ -87,10 +90,10 @@ describe('gatsby-remark-embedder', () => { await expect( plugin({ cache, markdownAST }, { customTransformers: [errorTransformer] }) ).rejects.toMatchInlineSnapshot(` -[Error: The following error appeared while processing 'https://error-site.com/': + [Error: The following error appeared while processing 'https://error-site.com/': -An error occurred in ErrorTransformer] -`); + An error occurred in ErrorTransformer] + `); }); cases( diff --git a/src/__tests__/transformers/GoogleSlides.js b/src/__tests__/transformers/GoogleSlides.js new file mode 100644 index 00000000..aa535056 --- /dev/null +++ b/src/__tests__/transformers/GoogleSlides.js @@ -0,0 +1,80 @@ +import cases from 'jest-in-case'; + +import plugin from '../../'; +import { + getHTML, + getGoogleSlidesFrameSrc, + shouldTransform, +} from '../../transformers/GoogleSlides'; + +import { cache, getMarkdownASTForFile, parseASTToMarkdown } from '../helpers'; + +cases( + 'url validation', + ({ url, valid }) => { + expect(shouldTransform(url)).toBe(valid); + }, + { + 'non-GoogleSlides url': { + url: 'https://not-a-google-slides-url.com', + valid: false, + }, + 'non-GoogleDocs url with wrong host': { + url: 'https://google.docs.com', + valid: false, + }, + 'incorrect url with no id': { + url: + 'https://google.docs.com/presentation/d/e/pub?start=false&loop=false&delayms=3000', + valid: false, + }, + 'incorrect host': { + url: + 'https://google.docs.com/presentation/d/e/2PACX-1vR8apkUGyfetdVcF226v6fLMrPspWUlrOYFBFRceHjD_pVgXFFp1Ee1lfsOlUYeMnvMh5DrRT-InOE5/pub?start=false&loop=false&delayms=3000', + valid: false, + }, + 'full url': { + url: + 'https://docs.google.com/presentation/d/e/2PACX-1vR8apkUGyfetdVcF226v6fLMrPspWUlrOYFBFRceHjD_pVgXFFp1Ee1lfsOlUYeMnvMh5DrRT-InOE5/pub?start=false&loop=false&delayms=3000', + valid: true, + }, + } +); + +cases( + 'getYouTubeIFrameSrc', + ({ url, iframe }) => { + expect(getGoogleSlidesFrameSrc(url)).toBe(iframe); + }, + { + 'full url': { + url: + 'https://docs.google.com/presentation/d/e/2PACX-1vR8apkUGyfetdVcF226v6fLMrPspWUlrOYFBFRceHjD_pVgXFFp1Ee1lfsOlUYeMnvMh5DrRT-InOE5/pub?start=false&loop=false&delayms=3000', + iframe: + 'https://docs.google.com/presentation/d/e/2PACX-1vR8apkUGyfetdVcF226v6fLMrPspWUlrOYFBFRceHjD_pVgXFFp1Ee1lfsOlUYeMnvMh5DrRT-InOE5/embed?start=false&loop=false&delayms=3000', + }, + } +); + +test('Gets the correct GoogleSlides iframe', async () => { + const html = await getHTML( + 'https://docs.google.com/presentation/d/e/2PACX-1vR8apkUGyfetdVcF226v6fLMrPspWUlrOYFBFRceHjD_pVgXFFp1Ee1lfsOlUYeMnvMh5DrRT-InOE5/pub?start=false&loop=false&delayms=3000' + ); + + expect(html).toMatchInlineSnapshot( + `""` + ); +}); + +test('Plugin can transform Google Slides links', async () => { + const markdownAST = getMarkdownASTForFile('GoogleSlides'); + + const processedAST = await plugin({ cache, markdownAST }); + + expect(parseASTToMarkdown(processedAST)).toMatchInlineSnapshot(` + " + + + " + `); +}); diff --git a/src/__tests__/transformers/__fixtures__/GoogleSlides.md b/src/__tests__/transformers/__fixtures__/GoogleSlides.md new file mode 100644 index 00000000..87c56673 --- /dev/null +++ b/src/__tests__/transformers/__fixtures__/GoogleSlides.md @@ -0,0 +1,3 @@ +https://docs.google.com/presentation/d/e/pub?start=false&loop=false&delayms=3000 + +https://docs.google.com/presentation/d/e/2PACX-1vR8apkUGyfetdVcF226v6fLMrPspWUlrOYFBFRceHjD_pVgXFFp1Ee1lfsOlUYeMnvMh5DrRT-InOE5/pub?start=false&loop=false&delayms=3000 diff --git a/src/transformers/GoogleSlides.js b/src/transformers/GoogleSlides.js new file mode 100644 index 00000000..9b76eaa0 --- /dev/null +++ b/src/transformers/GoogleSlides.js @@ -0,0 +1,27 @@ +export const shouldTransform = (url) => { + const { host, pathname } = new URL(url); + + return ( + host === 'docs.google.com' || + (['www.docs.google.com', 'docs.google.com'].includes(host) && + pathname.split('/').length === 6) + ); +}; + +export const getGoogleSlidesFrameSrc = (urlString) => { + const { pathname } = new URL(urlString); + const splitedPathName = pathname.split('/'); + const id = splitedPathName[splitedPathName.length - 2]; + + const embedUrl = new URL( + `https://docs.google.com/presentation/d/e/${id}/embed?start=false&loop=false&delayms=3000` + ); + + return embedUrl.toString(); +}; + +export const getHTML = (url) => { + const iframeUrl = getGoogleSlidesFrameSrc(url); + + return ``; +}; diff --git a/src/transformers/index.js b/src/transformers/index.js index 50483ca3..d6555044 100644 --- a/src/transformers/index.js +++ b/src/transformers/index.js @@ -11,6 +11,7 @@ import * as StreamableTransformer from './Streamable'; import * as TwitchTransformer from './Twitch'; import * as TwitterTransformer from './Twitter'; import * as YouTubeTransformer from './YouTube'; +import * as GoogleSlideTransformer from './GoogleSlides'; export const defaultTransformers = [ CodePenTransformer, @@ -26,4 +27,5 @@ export const defaultTransformers = [ TwitchTransformer, TwitterTransformer, YouTubeTransformer, + GoogleSlideTransformer, ];