/**
 * Copyright 2026 Google LLC
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *     http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */

import {html} from 'lit';
import {assert, fixture} from '@open-wc/testing';
import {ChromedashGuideNewPage} from './chromedash-guide-new-page.js';
import {ChromeStatusClient} from '../js-src/cs-client.js';
import sinon from 'sinon';

describe('chromedash-guide-new-page', () => {
  beforeEach(async () => {
    window.csClient = new ChromeStatusClient('fake_token', 1);
    sinon.stub(window.csClient, 'getBlinkComponents');
    window.csClient.getBlinkComponents.returns(Promise.resolve({}));
  });

  afterEach(() => {
    window.csClient.getBlinkComponents.restore();
  });

  it('renders with fake data', async () => {
    const userEmail = 'user@gmail.com';
    const component = await fixture(
      html`<chromedash-guide-new-page .userEmail=${userEmail}>
      </chromedash-guide-new-page>`
    );
    assert.exists(component);
    assert.instanceOf(component, ChromedashGuideNewPage);

    const subheaderDiv = component.renderRoot.querySelector('div#subheader');
    assert.exists(subheaderDiv);
    // Process and UI feedback link is clickable
    assert.include(
      subheaderDiv.innerHTML,
      'href="https://github.com/GoogleChrome/chromium-dashboard/issues/new?labels=Feedback&amp;template=process-and-guide-ux-feedback.md"'
    );

    // overview form exists and is with action path
    const overviewForm = component.renderRoot.querySelector('form')!;
    assert.exists(overviewForm);

    // owner field filled with the user email
    assert.include(overviewForm.innerHTML, userEmail);

    // feature type chromedash-form-field exists and is with four options
    const featureTypeFormField = component.renderRoot.querySelector(
      'chromedash-form-field[name="feature_type_radio_group"]'
    )!;
    assert.include(featureTypeFormField.outerHTML, 'New or changed feature');
    assert.include(featureTypeFormField.outerHTML, 'Chromium catches up');
    assert.include(
      featureTypeFormField.outerHTML,
      'No developer-visible change'
    );
    assert.include(featureTypeFormField.outerHTML, 'Feature removal');

    // submit button exists
    const submitButton = component.renderRoot.querySelector(
      'input[type="submit"]'
    );
    assert.exists(submitButton);
  });

  it('handleFormSubmit redirects to feature page (non-enterprise)', async () => {
    const userEmail = 'user@gmail.com';
    const component = await fixture<ChromedashGuideNewPage>(
      html`<chromedash-guide-new-page .userEmail=${userEmail}>
      </chromedash-guide-new-page>`
    );
    await component.updateComplete;

    const navigateStub = sinon.stub(component, 'navigate');
    const createFeatureStub = sinon.stub(window.csClient, 'createFeature');
    createFeatureStub.returns(Promise.resolve({feature_id: 12345}));

    const fakeEvent = {preventDefault: sinon.spy()};
    const hiddenTokenField = component.renderRoot.querySelector(
      'input[name="token"]'
    );
    component.handleFormSubmit(fakeEvent, hiddenTokenField);

    assert.isTrue(fakeEvent.preventDefault.calledOnce);
    assert.isTrue(createFeatureStub.calledOnce);

    // Default feature type should be 0 (Incubate)
    assert.equal(createFeatureStub.firstCall.args[0].feature_type, 0);

    await new Promise(resolve => setTimeout(resolve, 0));

    assert.isTrue(navigateStub.calledOnceWith('/feature/12345'));

    createFeatureStub.restore();
    navigateStub.restore();
  });

  it('handleFormSubmit redirects to feature page (enterprise)', async () => {
    const userEmail = 'user@gmail.com';
    const component = await fixture<ChromedashGuideNewPage>(
      html`<chromedash-guide-new-page
        .userEmail=${userEmail}
        .isEnterpriseFeature=${true}
      >
      </chromedash-guide-new-page>`
    );
    await component.updateComplete;

    const navigateStub = sinon.stub(component, 'navigate');
    const createFeatureStub = sinon.stub(window.csClient, 'createFeature');
    createFeatureStub.returns(Promise.resolve({feature_id: 54321}));

    const fakeEvent = {preventDefault: sinon.spy()};
    const hiddenTokenField = component.renderRoot.querySelector(
      'input[name="token"]'
    );
    component.handleFormSubmit(fakeEvent, hiddenTokenField);

    assert.isTrue(fakeEvent.preventDefault.calledOnce);
    assert.isTrue(createFeatureStub.calledOnce);

    // Feature type should be 4 (Enterprise)
    assert.equal(createFeatureStub.firstCall.args[0].feature_type, 4);

    await new Promise(resolve => setTimeout(resolve, 0));

    assert.isTrue(
      navigateStub.calledOnceWith('/guide/editall/54321#id_rollout_milestone')
    );

    createFeatureStub.restore();
    navigateStub.restore();
  });
});
