From 0eebe373b0ffa532bfaf8784b8b53cddf8414037 Mon Sep 17 00:00:00 2001
From: Ward Oosterlijnck <wardoosterlijnck@gmail.com>
Date: Sun, 31 Mar 2019 22:27:05 +1100
Subject: [PATCH] NewTabStory utility component that prompts user to open story
 in new tab

---
 src/__stories__/useFavicon.story.tsx | 11 +++++++----
 src/__stories__/useTitle.story.tsx   | 11 +++++++----
 src/__stories__/util/NewTabStory.tsx | 15 +++++++++++++++
 3 files changed, 29 insertions(+), 8 deletions(-)
 create mode 100644 src/__stories__/util/NewTabStory.tsx

diff --git a/src/__stories__/useFavicon.story.tsx b/src/__stories__/useFavicon.story.tsx
index 78817b61..30b4bc5b 100644
--- a/src/__stories__/useFavicon.story.tsx
+++ b/src/__stories__/useFavicon.story.tsx
@@ -1,16 +1,19 @@
 import {storiesOf} from '@storybook/react';
 import * as React from 'react';
 import {useFavicon} from '..';
+import NewTabStory from './util/NewTabStory';
 import ShowDocs from '../util/ShowDocs';
 
 const Demo = () => {
   useFavicon('https://cdn.sstatic.net/Sites/stackoverflow/img/favicon.ico');
 
-  return null;
+  return (
+    <NewTabStory>
+      Favicon should be the Stack Overflow logo
+    </NewTabStory>
+  );
 };
 
 storiesOf('Side effects|useFavicon', module)
   .add('Docs', () => <ShowDocs md={require('../../docs/useFavicon.md')} />)
-  .add('Demo', () =>
-    <Demo/>
-  )
+  .add('Demo', () => <Demo/>)
diff --git a/src/__stories__/useTitle.story.tsx b/src/__stories__/useTitle.story.tsx
index 68270026..c12dc276 100644
--- a/src/__stories__/useTitle.story.tsx
+++ b/src/__stories__/useTitle.story.tsx
@@ -1,16 +1,19 @@
 import {storiesOf} from '@storybook/react';
 import * as React from 'react';
 import {useTitle} from '..';
+import NewTabStory from './util/NewTabStory';
 import ShowDocs from '../util/ShowDocs';
 
 const Demo = () => {
   useTitle('Hello world!');
 
-  return null;
+  return (
+    <NewTabStory>
+      Title should be "Hello world!"
+    </NewTabStory>
+  );
 };
 
 storiesOf('Side effects|useTitle', module)
   .add('Docs', () => <ShowDocs md={require('../../docs/useTitle.md')} />)
-  .add('Demo', () =>
-    <Demo/>
-  )
+  .add('Demo', () => <Demo/>)
diff --git a/src/__stories__/util/NewTabStory.tsx b/src/__stories__/util/NewTabStory.tsx
new file mode 100644
index 00000000..76f1500b
--- /dev/null
+++ b/src/__stories__/util/NewTabStory.tsx
@@ -0,0 +1,15 @@
+import * as React from 'react';
+
+const NewTabStory = ({children}) => {
+  if (window.location === window.parent.location) {
+    return children
+  }
+
+  return (
+    <p>
+      This story should be <a href={window.location.href} target='_blank' title='Open in new tab'>opened in a new tab</a>.
+    </p>
+  );
+}
+
+export default NewTabStory