import { mount } from '@vue/test-utils';
import SocialLoginButtons from '../SocialLoginButtons.vue';
import { describe, it, expect, vi } from 'vitest';

describe('SocialLoginButtons.vue', () => {
  it('renders the component correctly', () => {
    const wrapper = mount(SocialLoginButtons);
    expect(wrapper.find('.social-login-container').exists()).toBe(true);
    expect(wrapper.text()).toContain('or continue with');
  });

  it('renders the Google login button', () => {
    const wrapper = mount(SocialLoginButtons);
    const googleButton = wrapper.find('.btn-google');
    expect(googleButton.exists()).toBe(true);
    expect(googleButton.text()).toContain('Continue with Google');
  });

  // Since the Apple button is commented out, we won't test for its presence by default.
  // If it were to be enabled by a prop, we would add tests for that.

  it('calls handleGoogleLogin when Google button is clicked', async () => {
    // Mock window.location.href to prevent actual redirection
    // and to check if it's called.
    const originalLocation = window.location;
    // @ts-ignore
    delete window.location;
    // @ts-ignore
    window.location = { href: '' };

    const wrapper = mount(SocialLoginButtons);
    const googleButton = wrapper.find('.btn-google');
    await googleButton.trigger('click');

    // Check if window.location.href was set as expected
    expect(window.location.href).toBe('/auth/google/login');

    // Restore original window.location
    window.location = originalLocation;
  });

  // If handleAppleLogin were active and the button present, a similar test would be here.
  // it('calls handleAppleLogin when Apple button is clicked', async () => {
  //   const wrapper = mount(SocialLoginButtons);
  //   // Mock handleAppleLogin if it were complex, or spy on window.location.href
  //   // For this example, let's assume it would also change window.location.href
  //   const originalLocation = window.location;
  //   // @ts-ignore
  //   delete window.location;
  //   // @ts-ignore
  //   window.location = { href: '' };

  //   const appleButton = wrapper.find('.btn-apple'); // This would fail as it's commented out
  //   if (appleButton.exists()) { // Check to prevent error if button doesn't exist
  //     await appleButton.trigger('click');
  //     expect(window.location.href).toBe('/auth/apple/login');
  //   }
  //   window.location = originalLocation;
  // });
});
