import { ComponentFixture, TestBed } from "@angular/core/testing";

import { Testimonials } from "../config/Testimonials";

import { ReviewComponent } from "./review.component";

describe("ReviewComponent", () => {
  let component: ReviewComponent;
  let fixture: ComponentFixture<ReviewComponent>;
  let compiled: HTMLElement;

  beforeEach(async () => {
    await TestBed.configureTestingModule({
      imports: [ReviewComponent]
    }).compileComponents();

    fixture = TestBed.createComponent(ReviewComponent);
    component = fixture.componentInstance;
  });

  for (const expected of Testimonials) {
    it(`should parse ${expected.name} properties correctly`, () => {
      component.review = expected;
      fixture.detectChanges();
      expect(component.review).toBe(expected);
      expect(component.name).toBe(expected.name);
      expect(component.sourceIcon).toEqual(expected.sourceIcon);
      expect(component.sourceUrl).toContain(expected.sourceUrl);
      expect(component.content).toBe(expected.content);
    });

    it(`should render ${expected.name} correctly`, () => {
      component.review = expected;
      fixture.detectChanges();
      compiled = fixture.nativeElement;
      const link = compiled.querySelector("a");
      expect(link?.href).toContain(expected.sourceUrl);
      expect(link?.target).toBe("_blank");
      expect(link?.rel).toBe("noopener noreferrer");

      const content = compiled.querySelector("article");
      expect(content?.textContent?.trim()).toBe(expected.content);
      const credit = compiled.querySelector("p");
      expect(credit?.textContent?.trim()).toBe(expected.name);
      const icon = compiled.querySelector("fa-icon");
      const svg = icon?.querySelector("svg");
      const path = svg?.querySelector("path");
      expect(path?.getAttribute("d")).toBe(
        expected.sourceIcon.icon[4] as string
      );
    });
  }
});
