require("babel-core/register");
require("babel-polyfill");

import * as React from "react";
import { render, screen, fireEvent, cleanup } from "@testing-library/react";
// import {
//   sampleContentData,
//   EditorWithCustomData,
// } from "@sc/modules/page/Builder/Builder.stories";

describe("Rendering > PageSections End-to-End Tests", () => {
  afterEach(cleanup);
  it(`Should show a new tab in the Add New Item drawer`, async () => {
    // render(<EditorWithCustomData content={sampleContentData} />);
    // await render(<div>This is a test</div>);
    // debug();
    expect(true).toBe(true);
  });

  it(`Should render a list of sections according to an onListItems plugin definition`, () => {});

  it(`Should show the <SectionsLegend /> component in the main canvas`, () => {});

  it(`Don't show the <SectionsLegend /> component on the canvas if there aren't any sections present on the page`, () => {});

  it(`Don't show the <SectionsLegend /> component on the canvas if in FULL SCREEN view (or preview)`, () => {});

  it(`Should show the <AddSectionsTab /> as a new component in the Item Drawer`, () => {});
});

describe("Actions > PageSections End-to-End Tests", () => {
  afterEach(cleanup);
  it(`Should highlight the associated canvas item is highlighted when section item is hovered over`, () => {});

  it(`Should activate the associated cavas editor item is selected when section item is active`, () => {});

  it(`Should be able to drag/drop a new section on to the page (from the add new item drawer)`, () => {});

  it(`Should be able to re-order a section on the page by dragging up and down`, () => {});

  it(`Should NOT be able to drag an object so that it's nested inside another container or adjacent to another component that is not a section itself`, () => {});
});