import * as path from "path";
import * as assert from "assert";

import TestServer from "./lib/TestServer";
import eventually from "./eventually";
import { Builder, Lanthan } from "lanthan";
import { WebDriver, Key } from "selenium-webdriver";
import Page from "./lib/Page";

const newApp = () => {
  const server = new TestServer();

  server.receiveContent(
    "/",
    `
    <!DOCTYPE html>
    <html lang="en"><body>
      <a href="hello">hello</a>
    </body></html>`
  );

  server.receiveContent(
    "/follow-input",
    `
    <!DOCTYPE html>
    <html lang="en"><body>
      <input>
    </body></html>`
  );

  server.receiveContent(
    "/area",
    `
    <!DOCTYPE html>
    <html lang="en"><body>
      <img
        width="256" height="256"  usemap="#map"
        src="data:image/gif;base64,R0lGODlhAQABAIAAAAUEBAAAACwAAAAAAQABAAACAkQBADs="
      >
      <map name="map">
        <area shape="rect" coords="0,0,64,64" href="/">
        <area shape="rect" coords="64,64,64,64" href="/">
        <area shape="rect" coords="128,128,64,64" href="/">
      </map>
    </body></html>`
  );

  /*
   * test case: link2 is out of the viewport
   * +-----------------+
   * |   [link1]       |<--- window
   * |                 |
   * |=================|<--- viewport
   * |   [link2]       |
   * |                 |
   * +-----------------+
   */
  server.receiveContent(
    "/test1",
    `
    <!DOCTYPE html>
    <html lang="en"><body>
      <div><a href="link1">link1</a></div>
      <div style="min-height:3000px"></div>
      <div><a href="link2">link2</a></div>
    </body></html>`
  );

  /*
   * test case 2: link2 and link3 are out of window of the frame
   * +-----------------+
   * | +-----------+   |
   * | | [link1]   |   |
   * |=================|
   * | | [link2]   |   |
   * | +-----------+   |
   * |                 |
   * +-----------------+
   */
  server.receiveContent(
    "/test2",
    `
    <!DOCTYPE html>
    <html lang="en"><body>
      <iframe height="5000" src='/test2-frame'>
    </body></html>`
  );
  server.receiveContent(
    "/test2-frame",
    `
    <!DOCTYPE html>
    <html lang="en"><body>
      <div><a href="link1">link1</a></div>
      <div style="min-height:3000px"></div>
      <div><a href="link2">link2</a></div>
    </body></html>`
  );

  /* test case 3: link2 is out of window of the frame
   * +-----------------+
   * | +-----------+   |
   * | | [link1]   |   |
   * | +-----------+   |
   * | : [link2]   :   |
   * | + - - - - - +   |
   * |                 |
   * +-----------------+
   */
  server.receiveContent(
    "/test3",
    `
    <!DOCTYPE html>
    <html lang="en"><body>
      <iframe src='/test3-frame'>
    </body></html>`
  );
  server.receiveContent(
    "/test3-frame",
    `
    <!DOCTYPE html>
    <html lang="en"><body>
      <div><a href="link1">link1</a></div>
      <div style="min-height:3000px"></div>
      <div><a href="link2">link2</a></div>
    </body></html>`
  );

  return server;
};

describe("follow test", () => {
  const server = newApp();
  let lanthan: Lanthan;
  let webdriver: WebDriver;
  let browser: any;

  before(async () => {
    lanthan = await Builder.forBrowser("firefox")
      .spyAddon(path.join(__dirname, ".."))
      .build();
    webdriver = lanthan.getWebDriver();
    browser = lanthan.getWebExtBrowser();
    await server.start();
  });

  after(async () => {
    await server.stop();
    if (lanthan) {
      await lanthan.quit();
    }
  });

  afterEach(async () => {
    const tabs = await browser.tabs.query({});
    for (const tab of tabs.slice(1)) {
      await browser.tabs.remove(tab.id);
    }
  });

  it("should focus an input by f", async () => {
    const page = await Page.navigateTo(webdriver, server.url("/follow-input"));
    await page.sendKeys("f");
    await page.waitAndGetHints();
    await page.sendKeys("a");

    const tagName = (await webdriver.executeScript(
      () => document.activeElement!.tagName
    )) as string;
    assert.strictEqual(tagName.toLowerCase(), "input");
  });

  it("should open a link by f", async () => {
    const page = await Page.navigateTo(webdriver, server.url());
    await page.sendKeys("f");
    await page.waitAndGetHints();
    await page.sendKeys("a");

    await eventually(async () => {
      const hash = await webdriver.executeScript("return location.pathname");
      assert.strictEqual(hash, "/hello");
    });
  });

  it("should focus an input by F", async () => {
    const page = await Page.navigateTo(webdriver, server.url("/follow-input"));
    await page.sendKeys(Key.SHIFT, "f");
    await page.waitAndGetHints();
    await page.sendKeys("a");

    const tagName = (await webdriver.executeScript(
      () => document.activeElement!.tagName
    )) as string;
    assert.strictEqual(tagName.toLowerCase(), "input");
  });

  it("should open a link to new tab by F", async () => {
    const page = await Page.navigateTo(webdriver, server.url());
    await page.sendKeys(Key.SHIFT, "f");
    await page.waitAndGetHints();
    await page.sendKeys("a");

    await eventually(async () => {
      const tabs = await browser.tabs.query({});
      assert.strictEqual(tabs.length, 2);
      assert.strictEqual(new URL(tabs[1].url).pathname, "/hello");
      assert.strictEqual(tabs[1].openerTabId, tabs[0].id);
    });
  });

  it("should show hints of links in area", async () => {
    const page = await Page.navigateTo(webdriver, server.url("/area"));
    await page.sendKeys(Key.SHIFT, "f");

    const hints = await page.waitAndGetHints();
    assert.strictEqual(hints.length, 3);
  });

  it("should shows hints only in viewport", async () => {
    const page = await Page.navigateTo(webdriver, server.url("/test1"));
    await page.sendKeys(Key.SHIFT, "f");

    const hints = await page.waitAndGetHints();
    assert.strictEqual(hints.length, 1);
  });

  it("should shows hints only in window of the frame", async () => {
    const page = await Page.navigateTo(webdriver, server.url("/test2"));
    await page.sendKeys(Key.SHIFT, "f");

    await webdriver.switchTo().frame(0);
    const hints = await page.waitAndGetHints();
    assert.strictEqual(hints.length, 1);
  });

  it("should shows hints only in the frame", async () => {
    const page = await Page.navigateTo(webdriver, server.url("/test3"));
    await page.sendKeys(Key.SHIFT, "f");

    await webdriver.switchTo().frame(0);
    const hints = await page.waitAndGetHints();
    assert.strictEqual(hints.length, 1);
  });
});