diff --git a/apps/vr-tests/src/stories/ButtonNext.stories.tsx b/apps/vr-tests/src/stories/ButtonNext.stories.tsx
index 5fe2d9f86be16..e34ec74ba4d5b 100644
--- a/apps/vr-tests/src/stories/ButtonNext.stories.tsx
+++ b/apps/vr-tests/src/stories/ButtonNext.stories.tsx
@@ -3,8 +3,10 @@ import * as React from 'react';
 import Screener, { Steps } from 'screener-storybook/src/screener';
 import { storiesOf } from '@storybook/react';
 import { Button } from '@fluentui/react-button';
+import { FabricDecorator } from '../utilities';
 
 storiesOf('Button Next', module)
+  .addDecorator(FabricDecorator)
   .addDecorator(story => (
     <Screener
       steps={new Steps()
@@ -13,6 +15,14 @@ storiesOf('Button Next', module)
         .snapshot('hover', { cropTo: '.testWrapper' })
         .mouseDown('button')
         .snapshot('pressed', { cropTo: '.testWrapper' })
+        .executeScript(
+          "document.getElementsByClassName('testWrapper')[0].classList.add('ms-Fabric--isFocusVisible')",
+        )
+        .executeScript("document.getElementsByTagName('button')[0].focus()")
+        .snapshot('focus', { cropTo: '.testWrapper' })
+        .executeScript(
+          "document.getElementsByClassName('testWrapper')[0].classList.remove('ms-Fabric--isFocusVisible')",
+        )
         .end()}
     >
       {story()}
@@ -24,6 +34,7 @@ storiesOf('Button Next', module)
   .addStory('Primary Disabled', () => <Button primary disabled content="Hello, world" />);
 
 storiesOf('Button Next - With icon before content', module)
+  .addDecorator(FabricDecorator)
   .addDecorator(story => (
     <Screener
       steps={new Steps()
@@ -32,6 +43,14 @@ storiesOf('Button Next - With icon before content', module)
         .snapshot('hover', { cropTo: '.testWrapper' })
         .mouseDown('button')
         .snapshot('pressed', { cropTo: '.testWrapper' })
+        .executeScript(
+          "document.getElementsByClassName('testWrapper')[0].classList.add('ms-Fabric--isFocusVisible')",
+        )
+        .executeScript("document.getElementsByTagName('button')[0].focus()")
+        .snapshot('focus', { cropTo: '.testWrapper' })
+        .executeScript(
+          "document.getElementsByClassName('testWrapper')[0].classList.remove('ms-Fabric--isFocusVisible')",
+        )
         .end()}
     >
       {story()}
@@ -43,6 +62,7 @@ storiesOf('Button Next - With icon before content', module)
   .addStory('Primary Disabled', () => <Button primary disabled content="Hello, world" icon="X" />);
 
 storiesOf('Button Next - With icon after content', module)
+  .addDecorator(FabricDecorator)
   .addDecorator(story => (
     <Screener
       steps={new Steps()
@@ -51,6 +71,14 @@ storiesOf('Button Next - With icon after content', module)
         .snapshot('hover', { cropTo: '.testWrapper' })
         .mouseDown('button')
         .snapshot('pressed', { cropTo: '.testWrapper' })
+        .executeScript(
+          "document.getElementsByClassName('testWrapper')[0].classList.add('ms-Fabric--isFocusVisible')",
+        )
+        .executeScript("document.getElementsByTagName('button')[0].focus()")
+        .snapshot('focus', { cropTo: '.testWrapper' })
+        .executeScript(
+          "document.getElementsByClassName('testWrapper')[0].classList.remove('ms-Fabric--isFocusVisible')",
+        )
         .end()}
     >
       {story()}
@@ -68,6 +96,7 @@ storiesOf('Button Next - With icon after content', module)
   ));
 
 storiesOf('Button Next - Circular', module)
+  .addDecorator(FabricDecorator)
   .addDecorator(story => (
     <Screener
       steps={new Steps()
@@ -76,6 +105,14 @@ storiesOf('Button Next - Circular', module)
         .snapshot('hover', { cropTo: '.testWrapper' })
         .mouseDown('button')
         .snapshot('pressed', { cropTo: '.testWrapper' })
+        .executeScript(
+          "document.getElementsByClassName('testWrapper')[0].classList.add('ms-Fabric--isFocusVisible')",
+        )
+        .executeScript("document.getElementsByTagName('button')[0].focus()")
+        .snapshot('focus', { cropTo: '.testWrapper' })
+        .executeScript(
+          "document.getElementsByClassName('testWrapper')[0].classList.remove('ms-Fabric--isFocusVisible')",
+        )
         .end()}
     >
       {story()}
@@ -89,6 +126,7 @@ storiesOf('Button Next - Circular', module)
   ));
 
 storiesOf('Button Next - Icon only', module)
+  .addDecorator(FabricDecorator)
   .addDecorator(story => (
     <Screener
       steps={new Steps()
@@ -97,6 +135,14 @@ storiesOf('Button Next - Icon only', module)
         .snapshot('hover', { cropTo: '.testWrapper' })
         .mouseDown('button')
         .snapshot('pressed', { cropTo: '.testWrapper' })
+        .executeScript(
+          "document.getElementsByClassName('testWrapper')[0].classList.add('ms-Fabric--isFocusVisible')",
+        )
+        .executeScript("document.getElementsByTagName('button')[0].focus()")
+        .snapshot('focus', { cropTo: '.testWrapper' })
+        .executeScript(
+          "document.getElementsByClassName('testWrapper')[0].classList.remove('ms-Fabric--isFocusVisible')",
+        )
         .end()}
     >
       {story()}
@@ -110,6 +156,7 @@ storiesOf('Button Next - Icon only', module)
   ));
 
 storiesOf('Button Next - Fluid', module)
+  .addDecorator(FabricDecorator)
   .addDecorator(story => (
     <Screener
       steps={new Steps()
@@ -118,6 +165,14 @@ storiesOf('Button Next - Fluid', module)
         .snapshot('hover', { cropTo: '.testWrapper' })
         .mouseDown('button')
         .snapshot('pressed', { cropTo: '.testWrapper' })
+        .executeScript(
+          "document.getElementsByClassName('testWrapper')[0].classList.add('ms-Fabric--isFocusVisible')",
+        )
+        .executeScript("document.getElementsByTagName('button')[0].focus()")
+        .snapshot('focus', { cropTo: '.testWrapper' })
+        .executeScript(
+          "document.getElementsByClassName('testWrapper')[0].classList.remove('ms-Fabric--isFocusVisible')",
+        )
         .end()}
     >
       {story()}
@@ -131,6 +186,7 @@ storiesOf('Button Next - Fluid', module)
   ));
 
 storiesOf('Button Next - Inverted', module)
+  .addDecorator(FabricDecorator)
   .addDecorator(story => (
     <Screener
       steps={new Steps()
@@ -139,6 +195,14 @@ storiesOf('Button Next - Inverted', module)
         .snapshot('hover', { cropTo: '.testWrapper' })
         .mouseDown('button')
         .snapshot('pressed', { cropTo: '.testWrapper' })
+        .executeScript(
+          "document.getElementsByClassName('testWrapper')[0].classList.add('ms-Fabric--isFocusVisible')",
+        )
+        .executeScript("document.getElementsByTagName('button')[0].focus()")
+        .snapshot('focus', { cropTo: '.testWrapper' })
+        .executeScript(
+          "document.getElementsByClassName('testWrapper')[0].classList.remove('ms-Fabric--isFocusVisible')",
+        )
         .end()}
     >
       {story()}
@@ -152,6 +216,7 @@ storiesOf('Button Next - Inverted', module)
   ));
 
 storiesOf('Button Next - Loading', module)
+  .addDecorator(FabricDecorator)
   .addDecorator(story => (
     <Screener
       steps={new Steps()
@@ -160,6 +225,14 @@ storiesOf('Button Next - Loading', module)
         .snapshot('hover', { cropTo: '.testWrapper' })
         .mouseDown('button')
         .snapshot('pressed', { cropTo: '.testWrapper' })
+        .executeScript(
+          "document.getElementsByClassName('testWrapper')[0].classList.add('ms-Fabric--isFocusVisible')",
+        )
+        .executeScript("document.getElementsByTagName('button')[0].focus()")
+        .snapshot('focus', { cropTo: '.testWrapper' })
+        .executeScript(
+          "document.getElementsByClassName('testWrapper')[0].classList.remove('ms-Fabric--isFocusVisible')",
+        )
         .end()}
     >
       {story()}
@@ -173,6 +246,7 @@ storiesOf('Button Next - Loading', module)
   ));
 
 storiesOf('Button Next - Sizes', module)
+  .addDecorator(FabricDecorator)
   .addDecorator(story => (
     <Screener
       steps={new Steps()
@@ -181,6 +255,14 @@ storiesOf('Button Next - Sizes', module)
         .snapshot('hover', { cropTo: '.testWrapper' })
         .mouseDown('button')
         .snapshot('pressed', { cropTo: '.testWrapper' })
+        .executeScript(
+          "document.getElementsByClassName('testWrapper')[0].classList.add('ms-Fabric--isFocusVisible')",
+        )
+        .executeScript("document.getElementsByTagName('button')[0].focus()")
+        .snapshot('focus', { cropTo: '.testWrapper' })
+        .executeScript(
+          "document.getElementsByClassName('testWrapper')[0].classList.remove('ms-Fabric--isFocusVisible')",
+        )
         .end()}
     >
       {story()}