diff --git a/src/__tests__/transformers/CodePen.js b/src/__tests__/transformers/CodePen.js
index 7b8d1f2c..24d17168 100644
--- a/src/__tests__/transformers/CodePen.js
+++ b/src/__tests__/transformers/CodePen.js
@@ -1,8 +1,6 @@
import cases from 'jest-in-case';
-
import plugin from '../../';
import { getHTML, shouldTransform } from '../../transformers/CodePen';
-
import { cache, getMarkdownASTForFile, parseASTToMarkdown } from '../helpers';
cases(
@@ -79,13 +77,24 @@ cases(
);
test('Gets the correct CodePen iframe', () => {
- const html = getHTML('https://codepen.io/team/codepen/pen/PNaGbb');
+ const html = getHTML('https://codepen.io/team/codepen/pen/PNaGbb', {});
expect(html).toMatchInlineSnapshot(
`""`
);
});
+test('Gets the correct CodePen iframe with custom dimensions', () => {
+ const html = getHTML('https://codepen.io/team/codepen/pen/PNaGbb', {
+ width: '50%',
+ height: '50%',
+ });
+
+ expect(html).toMatchInlineSnapshot(
+ `""`
+ );
+});
+
test('Plugin can transform CodePen links', async () => {
const markdownAST = getMarkdownASTForFile('CodePen');
diff --git a/src/transformers/CodePen.js b/src/transformers/CodePen.js
index 43a393bd..6171eea7 100644
--- a/src/transformers/CodePen.js
+++ b/src/transformers/CodePen.js
@@ -7,8 +7,8 @@ export const shouldTransform = (url) => {
);
};
-export const getHTML = (url) => {
+export const getHTML = (url, { width = '100%', height = '300px' }) => {
const iframeUrl = url.replace('/pen/', '/embed/preview/');
- return ``;
+ return ``;
};