diff --git a/docs/Dockerfile b/docs/Dockerfile
index 190e35e96166b7306614279300c085bf27a6e531..b3c6ad61d6b9f107311ae01774bfb45957334315 100644
--- a/docs/Dockerfile
+++ b/docs/Dockerfile
@@ -1,20 +1,24 @@
 # TODO using dockerfile will not work for readthedocs ... 
 # need to consider how to build for read the docs
 
-FROM node:12 as img_autogen
-
+FROM xgui3783/pptr-docker:4383e79bc83452e4bdaf098039635c36c55ffb8f as img_autogen
 COPY . /iav
 WORKDIR /iav
 
 # build aot first && install webdriver & pptr
 RUN npm i 
 
+# build-aot
+RUN npm run build-aot
+
+# for selenium web driver
+# RUN apt-get update && apt-get install default-jre -y
+
 # update webdriver
 RUN npm run wd -- update --versions.chrome=80.0.3987.106
 
-# parallel build-aot and install pptr
-RUN npm run build-aot & \
-    npm i --no-save puppeteer@2.1.0
+# install pptr
+RUN npm i --no-save puppeteer@2.1.0
 
 # install deploy folder
 RUN cd deploy && \
diff --git a/e2e/screenshots/gen.js b/e2e/screenshots/gen.js
index d81a922c7e2c42e28827fa94288a0a307ea7eb94..18a17d20eaf7ec2440da2def529b57f04f11f4e4 100644
--- a/e2e/screenshots/gen.js
+++ b/e2e/screenshots/gen.js
@@ -3,22 +3,24 @@ const path = require('path')
 const glob = require('glob')
 describe('> generating screenshot', () => {
   let childProcess
+  const matches = glob.sync('**/*.e2e-screenshot.js', { cwd: path.join(__dirname, '../src') })
+  const cwdPath = path.join(__dirname, '../../deploy/')
+  
   beforeAll(done => {
-    const cwdPath = path.join(__dirname, '../../deploy/')
     childProcess = spawn('node', ['server.js'],  {
-      cwd: cwdPath
+      cwd: cwdPath,
+      env: {
+        ...process.env,
+        BUILD_TEXT: ''
+      }
     })
     setTimeout(done, 1000)
   })
 
-  require('../src/selecting/share.e2e-screenshot')
-  glob('../src/**/*.e2e-screenshot.js', (err, matches) => {
-    if (err) throw err
-    for (const match of matches) {
-      require(match)
-    }
-  })
-
+  for (const match of matches) {
+    const requirePath = path.join(cwdPath, match)
+    require(requirePath)
+  }
   afterAll(() => {
     childProcess.kill()
   })
diff --git a/e2e/src/selecting/share.e2e-screenshot.js b/e2e/src/selecting/share.e2e-screenshot.js
index b3295553fdf22752e98e470f51aba95961a16783..35d8872c4b53002c9053eb4831bd394775ac6e40 100644
--- a/e2e/src/selecting/share.e2e-screenshot.js
+++ b/e2e/src/selecting/share.e2e-screenshot.js
@@ -9,15 +9,20 @@ if (!exists) fs.mkdirSync(outputDir)
 
 describe('> share', () => {
   let iavPage
-  beforeEach(async () => {
+  beforeAll(async () => {
     iavPage = new AtlasPage()
     await iavPage.init()
     await iavPage.goto()
-    await iavPage.selectTitleCard('Big Brain (Histology)')
+    await iavPage.wait(1000)
+    await iavPage.selectTitleTemplateParcellation('Big Brain (Histology)', 'Grey/White matter')
     await iavPage.wait(1000)
     await iavPage.waitUntilAllChunksLoaded()
   })
 
+  afterEach(async () => {
+    await iavPage.clearAlerts()
+  })
+
   it('> generating highlight share btn', async () => {
     const b64 = await iavPage.takeScreenshot(`[aria-label="${ARIA_LABELS.SHARE_BTN}"]`)
 
diff --git a/e2e/src/util.js b/e2e/src/util.js
index 4956f0936e6bf66cd3d12580f18e2b07b9f63443..2b000c603d2f014dadd59485171725debc6ce960 100644
--- a/e2e/src/util.js
+++ b/e2e/src/util.js
@@ -5,7 +5,7 @@ const USE_SELENIUM = !!process.env.SELENIUM_ADDRESS
 if (ATLAS_URL.length === 0) throw new Error(`ATLAS_URL must either be left unset or defined.`)
 if (ATLAS_URL[ATLAS_URL.length - 1] === '/') throw new Error(`ATLAS_URL should not trail with a slash: ${ATLAS_URL}`)
 const { By, WebDriver, Key } = require('selenium-webdriver')
-const CITRUS_LIGHT_URL = `https://unpkg.com/citruslight@0.0.2/citruslight.js`
+const CITRUS_LIGHT_URL = `https://unpkg.com/citruslight@0.1.0/citruslight.js`
 
 function getActualUrl(url) {
   return /^http\:\/\//.test(url) ? url : `${ATLAS_URL}/${url.replace(/^\//, '')}`
@@ -68,8 +68,27 @@ class WdBase{
           })
       }, CITRUS_LIGHT_URL, cssSelector)
     }
+    
     await this.wait(1000)
     const result = await this._browser.takeScreenshot()
+
+    if (cssSelector) {
+      await this._browser.executeAsyncScript(async () => {
+        const cb = arguments[arguments.length - 1]
+        const moduleUrl = arguments[0]
+        const cssSelector = arguments[1]
+
+        const el = document.querySelector(cssSelector)
+        if (!el) throw new Error(`css selector not fetching anything`)
+        import(moduleUrl)
+          .then(async m => {
+            m.clearAll()
+            cb()
+          })
+      }, CITRUS_LIGHT_URL, cssSelector)
+    }
+    
+    await this.wait(1000)
     return result
   }