@testgorilla/tgo-coding-test 1.0.0 → 2.0.0

package/src/lib/services/candidate-coding-test-services/coderunner-api.service.spec.ts

@@ -0,0 +1,134 @@
+import { TestBed, waitForAsync } from '@angular/core/testing';
+import { CoderunnerApiService } from './coderunner-api.service';
+import { NO_ERRORS_SCHEMA } from '@angular/core';
+import {
+  ApiService,
+  getTranslocoModule,
+} from '@testgorilla/tgo-test-shared';
+import { of } from 'rxjs';
+import { SnackbarService } from '@testgorilla/tgo-ui';
+import { CodingTestConfigService } from '../../services/coding-test-config.service';
+
+// todo: add tests to check return type
+describe('CoderunnerApiService', () => {
+  let service: CoderunnerApiService;
+  let apiService: ApiService;
+  const baseUrl = 'www.some-test-url.com';
+  const invitationUuid = '123-456-789';
+  const testResultId = 123789;
+  const questionId = 123;
+  const questionResultId = 789;
+  const code = 'lorem ipsum';
+  const language = 'python';
+  const testCases = [
+    {
+      input: '1 2 3',
+      solution: '3 4 5',
+    },
+  ];
+  const headers = {};
+
+  beforeEach(waitForAsync(() => {
+    TestBed.configureTestingModule({
+      providers: [
+        CoderunnerApiService,
+        {
+          provide: ApiService,
+          useValue: {
+            post: jest.fn().mockReturnValue(of({})),
+            getInvitationUUID: jest.fn().mockReturnValue(invitationUuid),
+          },
+        },
+        {
+          provide: CodingTestConfigService,
+          useValue: {
+            getCoderunnerV2Endpoint: jest.fn().mockReturnValue(baseUrl),
+          },
+        },
+        { provide: SnackbarService, useValue: { error: jest.fn() } },
+      ],
+      imports: [getTranslocoModule()],
+      schemas: [NO_ERRORS_SCHEMA],
+    });
+
+    service = TestBed.inject(CoderunnerApiService);
+    apiService = TestBed.inject(ApiService);
+  }));
+
+  describe('when runPublicTest$ is called', () => {
+    const expectedUrl = `${baseUrl}/api/attempts/public/`;
+
+    it('should call api service with POST and proper params', () => {
+      const spy = jest.spyOn(apiService, 'post');
+
+      service.runPublicTest$(code, testCases, language);
+
+      expect(spy).toHaveBeenCalledWith(
+        expectedUrl,
+        {
+          question_id: 0,
+          code,
+          language,
+          testcases: testCases,
+          question_result_id: 0,
+        },
+        headers,
+        expect.any(Function),
+        true
+      );
+    });
+  });
+
+  describe('when runPreviewTest$ is called', () => {
+    const expectedUrl = `${baseUrl}/api/attempts/preview/`;
+
+    it('should call api service with POST and proper params', () => {
+      const spy = jest.spyOn(apiService, 'post');
+
+      service.runPreviewTest$(testResultId, code, testCases, language);
+
+      expect(spy).toHaveBeenCalledWith(
+        expectedUrl,
+        {
+          code,
+          language,
+          testcases: testCases,
+          test_result_id: testResultId,
+        },
+        headers,
+        expect.any(Function),
+        true
+      );
+    });
+  });
+
+  describe('when runNonPreviewTest$ is called', () => {
+    const expectedUrl = `${baseUrl}/api/attempts/`;
+
+    it('should call api service with POST and proper params', () => {
+      const spy = jest.spyOn(apiService, 'post');
+
+      service.runNonPreviewTest$(
+        questionId,
+        questionResultId,
+        code,
+        testCases,
+        language
+      );
+
+      expect(spy).toHaveBeenCalledWith(
+        expectedUrl,
+        {
+          question_id: questionId,
+          question_result_id: questionResultId,
+          code,
+          language,
+          testcases: testCases,
+        },
+        headers,
+        expect.any(Function),
+        true
+      );
+    });
+  });
+});

package/src/lib/services/candidate-coding-test-services/coderunner-api.service.ts

@@ -0,0 +1,105 @@
+import { inject, Injectable } from '@angular/core';
+import { ApiService } from '@testgorilla/tgo-test-shared';
+import { EMPTY, Observable, throwError } from 'rxjs';
+import { LATFormattedTestCases, SqlTestCase } from '../../models/test-cases';
+import { CoderunnerAttemptModel } from '../../models/coderunner-execution-results';
+import { HttpErrorResponse } from '@angular/common/http';
+import { SnackbarService } from '@testgorilla/tgo-ui';
+import { ROOT_TRANSLATIONS_SCOPE } from '../../models/translations';
+import { translate } from '@ngneat/transloco';
+import { CodeEvent, CodeEventResponse } from '../../models/code-event';
+import { CodingTestConfigService } from '../coding-test-config.service';
+
+@Injectable()
+export class CoderunnerApiService {
+  private readonly snackbarService = inject(SnackbarService);
+  private readonly apiService = inject(ApiService);
+  private readonly configService = inject(CodingTestConfigService);
+  
+  private readonly CR2Url = `${this.configService.getCoderunnerV2Endpoint()}/`;
+
+  // todo: will public preview be supported by mFE? if not - remove this
+  runPublicTest$(
+    code: string,
+    testcases: LATFormattedTestCases[] | SqlTestCase[],
+    language: string
+  ): Observable<CoderunnerAttemptModel> {
+    return this.apiService.post(
+      `${this.CR2Url}api/attempts/public/`,
+      {
+        question_id: 0,
+        language,
+        code,
+        testcases,
+        question_result_id: 0,
+      },
+      {},
+      this.handleError.bind(this),
+      true
+    );
+  }
+
+  runPreviewTest$(
+    test_result_id: number,
+    code: string,
+    testcases: LATFormattedTestCases[] | SqlTestCase[],
+    language: string
+  ): Observable<CoderunnerAttemptModel> {
+    return this.apiService.post(
+      `${this.CR2Url}api/attempts/preview/`,
+      {
+        language,
+        code,
+        testcases,
+        test_result_id,
+      },
+      {},
+      this.handleError.bind(this),
+      true
+    );
+  }
+
+  runNonPreviewTest$(
+    question_id: number,
+    question_result_id: number,
+    code: string,
+    testcases: LATFormattedTestCases[] | SqlTestCase[],
+    language: string
+  ): Observable<CoderunnerAttemptModel> {
+    return this.apiService.post(
+      `${this.CR2Url}api/attempts/`,
+      {
+        question_id,
+        language,
+        code,
+        testcases,
+        question_result_id,
+      },
+      {},
+      this.handleError.bind(this),
+      true
+    );
+  }
+
+  sendCodeEvent$(event: CodeEvent): Observable<CodeEventResponse> {
+    return this.apiService.post(
+      `${this.CR2Url}api/events/`,
+      event,
+      {},
+      this.handleError.bind(this),
+      true
+    );
+  }
+
+  private handleError({ error }: HttpErrorResponse): Observable<never> {
+    if (error.detail) {
+      return throwError(() => error);
+    }
+
+    const genericErrorText = translate(
+      `${ROOT_TRANSLATIONS_SCOPE}.ERRORS.SYSTEM_ERROR`
+    );
+    this.snackbarService.error(genericErrorText);
+    return EMPTY;
+  }
+}

package/src/lib/services/candidate-coding-test-services/coding-test-tour.service.spec.ts

@@ -0,0 +1,161 @@
+import { TestBed, waitForAsync } from '@angular/core/testing';
+import {
+  CodingTestTourMode,
+  CodingTestTourService,
+} from './coding-test-tour.service';
+import { NO_ERRORS_SCHEMA } from '@angular/core';
+import { getTranslocoModule } from '@testgorilla/tgo-test-shared';
+import { GuidedTourService } from 'ngx-guided-tour';
+
+describe('CodingTestTourService', () => {
+  let service: CodingTestTourService;
+  let guidedTourService: GuidedTourService;
+  let startTourSpy: jest.SpyInstance;
+
+  const minimumScreenSize = 599;
+  const tourId = 'lat-coding-tour';
+  const tourSelectors = [
+    '#language-dropdown',
+    '#test-cases',
+    '#configuration-ide-button',
+  ];
+  const practiceQuestionSelector = '#question-section';
+  const submitStepSelector = '[data-tourId*="question-next-finish-button"]';
+
+  beforeEach(waitForAsync(() => {
+    TestBed.configureTestingModule({
+      providers: [
+        CodingTestTourService,
+        {
+          provide: GuidedTourService,
+          useValue: {
+            currentTourStepCount: 10,
+            skipTour: jest.fn(),
+            startTour: jest.fn(),
+          },
+        },
+      ],
+      imports: [getTranslocoModule()],
+      schemas: [NO_ERRORS_SCHEMA],
+    });
+
+    service = TestBed.inject(CodingTestTourService);
+    guidedTourService = TestBed.inject(GuidedTourService);
+  }));
+
+  describe('when init is called', () => {
+    beforeEach(() => {
+      startTourSpy = jest.spyOn(guidedTourService, 'startTour');
+      Object.defineProperty(window, 'innerWidth', {
+        value: minimumScreenSize + 1,
+      });
+    });
+
+    describe('and window innerWidth is MORE than minimum screen size', () => {
+      describe('and mode is PracticeQuestion', () => {
+        it('should start tour with proper steps', () => {
+          const stepsExpectedList = [
+            practiceQuestionSelector,
+            ...tourSelectors,
+            submitStepSelector,
+          ].map((selector) =>
+            expect.objectContaining({
+              selector,
+            })
+          );
+
+          service.init(CodingTestTourMode.PracticeQuestion);
+
+          expect(startTourSpy).toHaveBeenCalledWith(
+            expect.objectContaining({
+              tourId,
+              useOrb: false,
+              minimumScreenSize,
+              steps: expect.arrayContaining(stepsExpectedList),
+            })
+          );
+        });
+      });
+
+      describe('and mode is RealQuestion', () => {
+        it('should start tour with proper steps', () => {
+          const stepsExpectedList = tourSelectors.map((selector) =>
+            expect.objectContaining({
+              selector,
+            })
+          );
+
+          service.init(CodingTestTourMode.PracticeQuestion);
+
+          expect(startTourSpy).toHaveBeenCalledWith(
+            expect.objectContaining({
+              tourId,
+              useOrb: false,
+              minimumScreenSize,
+              steps: expect.arrayContaining(stepsExpectedList),
+            })
+          );
+        });
+      });
+    });
+
+    describe('and window innerWidth is LESS than minimum screen size', () => {
+      it('should NOT start tour', () => {
+        Object.defineProperty(window, 'innerWidth', {
+          value: minimumScreenSize - 1,
+        });
+
+        service.init(CodingTestTourMode.RealQuestion);
+
+        expect(startTourSpy).not.toHaveBeenCalled();
+      });
+    });
+
+    it('should publish guided tour id', (done) => {
+      service.init(CodingTestTourMode.RealQuestion);
+
+      service.activeGuidedTourId$.subscribe((value) => {
+        expect(value).toEqual(tourId);
+        done();
+      });
+    });
+
+    afterEach(() => {
+      startTourSpy.mockRestore();
+    });
+  });
+
+  describe('when skipTour is called', () => {
+    let skipTourSpy: jest.SpyInstance;
+
+    beforeEach(() => {
+      skipTourSpy = jest.spyOn(guidedTourService, 'skipTour');
+    });
+
+    describe('and there is currentTourStepCount', () => {
+      it('should call guidedTourService skipTour', () => {
+        Object.defineProperty(guidedTourService, 'currentTourStepCount', {
+          get: jest.fn().mockReturnValue(1),
+        });
+        service.skipTour();
+
+        expect(skipTourSpy).toHaveBeenCalled();
+      });
+    });
+
+    describe('and there is NO currentTourStepCount', () => {
+      it('should NOT call guidedTourService skipTour', () => {
+        Object.defineProperty(guidedTourService, 'currentTourStepCount', {
+          get: jest.fn().mockReturnValue(null),
+        });
+        service.skipTour();
+
+        expect(skipTourSpy).not.toHaveBeenCalled();
+      });
+    });
+
+    afterEach(() => {
+      skipTourSpy.mockRestore();
+    });
+  });
+});

package/src/lib/services/candidate-coding-test-services/coding-test-tour.service.ts

@@ -0,0 +1,100 @@
+import { Injectable } from '@angular/core';
+import { translate } from '@ngneat/transloco';
+import {
+  GuidedTour,
+  GuidedTourService,
+  Orientation,
+  TourStep,
+} from 'ngx-guided-tour';
+import { BehaviorSubject } from 'rxjs';
+
+import { ROOT_TRANSLATIONS_SCOPE } from '../../models/translations';
+
+export const enum CodingTestTourMode {
+  PracticeQuestion = 'practice',
+  RealQuestion = 'real',
+}
+
+@Injectable()
+export class CodingTestTourService {
+  private readonly translationContext = `${ROOT_TRANSLATIONS_SCOPE}.TOUR.`;
+  private readonly guidedTourId = 'lat-coding-tour';
+  private readonly MINIMUM_SCREEN_SIZE = 599;
+
+  private activeGuidedTourIdSub$ = new BehaviorSubject('');
+  activeGuidedTourId$ = this.activeGuidedTourIdSub$.asObservable();
+
+  constructor(private guidedTourService: GuidedTourService) {}
+
+  init(mode: CodingTestTourMode): void {
+    this.start(mode);
+  }
+
+  skipTour(): void {
+    // currentTourStepCount checks if there is a currentTour before checking stepCount.
+    if (this.guidedTourService.currentTourStepCount) {
+      this.guidedTourService.skipTour();
+    }
+  }
+
+  private start(mode: CodingTestTourMode) {
+    if (window.innerWidth > this.MINIMUM_SCREEN_SIZE) {
+      this.guidedTourService.startTour(this.getTour(mode));
+    }
+    this.publishActiveGuidedTourId();
+  }
+
+  private publishActiveGuidedTourId(): void {
+    this.activeGuidedTourIdSub$.next(this.guidedTourId);
+  }
+
+  private getTour(mode: CodingTestTourMode): GuidedTour {
+    let steps: TourStep[] = [];
+    const step1 = {
+      title: translate(`${this.translationContext}STEP_1.TITLE`),
+      selector: '#question-section',
+      content: translate(`${this.translationContext}STEP_1.MESSAGE`),
+      orientation: Orientation.Right,
+    };
+    const step2 = {
+      title: translate(`${this.translationContext}STEP_2.TITLE`),
+      selector: '#language-dropdown',
+      content: translate(`${this.translationContext}STEP_2.MESSAGE`),
+      orientation: Orientation.Bottom,
+    };
+    const step3 = {
+      title: translate(`${this.translationContext}STEP_3.TITLE`),
+      selector: '#test-cases',
+      content: translate(`${this.translationContext}STEP_3.MESSAGE`),
+      orientation: Orientation.Top,
+    };
+    const step4 = {
+      title: translate(`${this.translationContext}STEP_4.TITLE`),
+      selector: '#configuration-ide-button',
+      content: translate(`${this.translationContext}STEP_4.MESSAGE`),
+      orientation: Orientation.BottomRight,
+    };
+    const step5 = {
+      title: translate(`${this.translationContext}STEP_5.TITLE`),
+      selector: '[data-tourId*="question-next-finish-button"]',
+      content: translate(`${this.translationContext}STEP_5.MESSAGE`),
+      orientation: Orientation.Bottom,
+    };
+
+    switch (mode) {
+      case CodingTestTourMode.PracticeQuestion:
+        steps = [step1, step2, step3, step4, step5];
+        break;
+      case CodingTestTourMode.RealQuestion:
+        steps = [step2, step3, step4];
+        break;
+    }
+
+    return {
+      tourId: this.guidedTourId,
+      useOrb: false,
+      minimumScreenSize: this.MINIMUM_SCREEN_SIZE,
+      steps,
+    };
+  }
+}