/* global cy */

const selectors = {
  defaultOutput: '.output-text',
  editor: '.monaco-editor',
  hotkeys: '.default-layout > div',
  runTestsButton: 'button:contains("Run the Tests")'
};

const locations = {
  index:
    '/learn/responsive-web-design/basic-html-and-html5/' +
    'say-hello-to-html-elements'
};

const defaultOutput = `
/**
* Your test output will go here
*/`;

// Disabled for https://github.com/freeCodeCamp/freeCodeCamp/issues/41009

// const runningOutput = '// running tests';
// const finishedOutput = '// tests completed';

describe('Classic challenge', function () {
  it('renders', () => {
    cy.visit(locations.index);

    cy.title().should(
      'eq',
      'Learn Basic HTML and HTML5: Say Hello to HTML Elements |' +
        ' freeCodeCamp.org'
    );
  });

  it('renders the default output text', () => {
    cy.visit(locations.index);
    cy.get(selectors.defaultOutput).contains(defaultOutput);
  });

  // Disabled for https://github.com/freeCodeCamp/freeCodeCamp/issues/41009

  // it('shows test output when the tests are run', () => {
  //   cy.visit(locations.index);
  //   // first wait for the editor to load
  //   cy.get(selectors.editor, { timeout: 15000 });
  //   cy.get(selectors.runTestsButton)
  //     .click()
  //     .then(() => {
  //       cy.get(selectors.defaultOutput)
  //         .contains(runningOutput)
  //         .contains(finishedOutput);
  //     });
  // });

  // it('shows test output when the tests are triggered by the keyboard', () => {
  //   cy.visit(locations.index);
  //   // first wait for the editor to load
  //   cy.get(selectors.editor, {
  //     timeout: 15000
  //   });
  //   cy.get(selectors.hotkeys)
  //     .focus()
  //     .type('{ctrl}{enter}')
  //     .then(() => {
  //       cy.get(selectors.defaultOutput)
  //         .contains(runningOutput)
  //         .contains(finishedOutput);
  //     });
  // });
});