Added height and width props to Twitch service

README.md

@@ -616,6 +616,8 @@ All options should go under the `Twitch` namespace.
 | name   | Type                  | Required | Default | Description                                                                                           |
 | ------ | --------------------- | -------- | ------- | ----------------------------------------------------------------------------------------------------- |
 | parent | `string` / `string[]` | ✅       |         | Domain(s) that will be embedding Twitch. You must have one parent key for each domain your site uses. |
+| height | `string`              |          | 300     | The height of the containing iframe                                                                   |
+| width  | `string`              |          | 100%    | The width of the containing iframe                                                                    |
 
 ##### parent
 

src/__tests__/transformers/Twitch.js

@@ -205,6 +205,18 @@ test('Gets the correct Twitch iframe', () => {
   );
 });
 
+test('Gets the correct Twitch iframe with custom dimensions', () => {
+  const html = getHTML('https://twitch.tv/videos/546761743', {
+    parent: 'embed.example.com',
+    width: '50%',
+    height: '50%',
+  });
+
+  expect(html).toMatchInlineSnapshot(
+    `<iframe src="https://player.twitch.tv?video=546761743&parent=embed.example.com" height="50%" width="50%" frameborder="0" scrolling="no" allowfullscreen></iframe>`
+  );
+});
+
 test('Plugin can transform Twitch links', async () => {
   const markdownAST = getMarkdownASTForFile('Twitch');
 

src/transformers/Twitch.js

@@ -91,12 +91,12 @@ export const normalizeParent = (parent) => {
   return parent;
 };
 
-export const getHTML = (url, { parent }) => {
+export const getHTML = (url, { parent, width = '100%', height = '300' }) => {
   const iframeUrl = `${getTwitchIFrameSrc(url)}&parent=${normalizeParent(
     parent
   )}`;
 
-  return `<iframe src="${iframeUrl}" height="300" width="100%" frameborder="0" scrolling="no" allowfullscreen></iframe>`;
+  return `<iframe src="${iframeUrl}" height="${height}" width="${width}" frameborder="0" scrolling="no" allowfullscreen></iframe>`;
 };
 
 export const name = 'Twitch';