Added support for taking screenshot during Notebook publish to Gallery (#108)

* Added support for taking screenshot

- Screenshot is taken using html2canvas package
- Converted to base 64 and uploaded to metadata
- For Using first display output
  - Notebok object is passed instead of string, to publish pane
  - The first cell with output present is parsed out
  - The dom is also parsed to get corresponding div element to take screenshot of the first output

* fixed bug

* Addressed PR comments

- FIxed bug that didn't capture screenshot when mutiple notebook tabs are opened

* removed unnecessary dependencies

* fixed compile issues

* more edits

src/Explorer/Notebook/NotebookUtil.test.ts

@@ -1,5 +1,15 @@
 import { NotebookUtil } from "./NotebookUtil";
 import * as GitHubUtils from "../../Utils/GitHubUtils";
+import {
+  ImmutableNotebook,
+  MediaBundle,
+  CodeCellParams,
+  MarkdownCellParams,
+  makeCodeCell,
+  makeMarkdownCell,
+  makeNotebookRecord
+} from "@nteract/commutable";
+import { List, Map } from "immutable";
 
 const fileName = "file";
 const notebookName = "file.ipynb";
@@ -7,6 +17,57 @@ const filePath = `folder/${fileName}`;
 const notebookPath = `folder/${notebookName}`;
 const gitHubFileUri = GitHubUtils.toContentUri("owner", "repo", "branch", filePath);
 const gitHubNotebookUri = GitHubUtils.toContentUri("owner", "repo", "branch", notebookPath);
+const notebookRecord = makeNotebookRecord({
+  cellOrder: List.of("0", "1", "2", "3"),
+  cellMap: Map({
+    "0": makeMarkdownCell({
+      cell_type: "markdown",
+      source: "abc",
+      metadata: undefined
+    } as MarkdownCellParams),
+    "1": makeCodeCell({
+      cell_type: "code",
+      execution_count: undefined,
+      metadata: undefined,
+      source: "print(5)",
+      outputs: List.of({
+        name: "stdout",
+        output_type: "stream",
+        text: "5"
+      })
+    } as CodeCellParams),
+    "2": makeCodeCell({
+      cell_type: "code",
+      execution_count: undefined,
+      metadata: undefined,
+      source: 'display(HTML("<h1>Sample html</h1>"))',
+      outputs: List.of({
+        data: Object.freeze({
+          data: {
+            "text/html": "<h1>Sample output</h1>",
+            "text/plain": "<IPython.core.display.HTML object>"
+          }
+        } as MediaBundle),
+        output_type: "display_data",
+        metadata: undefined
+      })
+    } as CodeCellParams),
+    "3": makeCodeCell({
+      cell_type: "code",
+      execution_count: undefined,
+      metadata: undefined,
+      source: 'print("hello world")',
+      outputs: List.of({
+        name: "stdout",
+        output_type: "stream",
+        text: "hello world"
+      })
+    } as CodeCellParams)
+  }),
+  nbformat_minor: 2,
+  nbformat: 2,
+  metadata: undefined
+});
 
 describe("NotebookUtil", () => {
   describe("isNotebookFile", () => {
@@ -46,4 +107,11 @@ describe("NotebookUtil", () => {
       );
     });
   });
+
+  describe("findFirstCodeCellWithDisplay", () => {
+    it("works for Notebook file", () => {
+      const notebookObject = notebookRecord as ImmutableNotebook;
+      expect(NotebookUtil.findFirstCodeCellWithDisplay(notebookObject)).toEqual(1);
+    });
+  });
 });