juice-shop

1
/*
2
 * Copyright (c) 2014-2024 Bjoern Kimminich & the OWASP Juice Shop contributors.
3
 * SPDX-License-Identifier: MIT
4
 */
5

6
import { TranslateModule } from '@ngx-translate/core'
7
import { ProductReviewEditComponent } from '../product-review-edit/product-review-edit.component'
8
import { By } from '@angular/platform-browser'
9
import { MatDividerModule } from '@angular/material/divider'
10
import { UserService } from '../Services/user.service'
11
import { ProductReviewService } from '../Services/product-review.service'
12
import { HttpClientTestingModule } from '@angular/common/http/testing'
13
import { BrowserAnimationsModule } from '@angular/platform-browser/animations'
14
import { MatButtonModule } from '@angular/material/button'
15
import { MatInputModule } from '@angular/material/input'
16
import { MatFormFieldModule } from '@angular/material/form-field'
17
import { MAT_DIALOG_DATA, MatDialog, MatDialogModule } from '@angular/material/dialog'
18
import { MatBadgeModule } from '@angular/material/badge'
19
import { type ComponentFixture, fakeAsync, flush, TestBed, waitForAsync } from '@angular/core/testing'
20
import { MatTooltipModule } from '@angular/material/tooltip'
21
import { MatIconModule } from '@angular/material/icon'
22
import { MatExpansionModule } from '@angular/material/expansion'
23

24
import { ProductDetailsComponent } from './product-details.component'
25
import { of, throwError } from 'rxjs'
26
import { ReactiveFormsModule } from '@angular/forms'
27
import { MatSnackBarModule } from '@angular/material/snack-bar'
28
import { type Product } from '../Models/product.model'
29

30
describe('ProductDetailsComponent', () => {
31
  let component: ProductDetailsComponent
32
  let fixture: ComponentFixture<ProductDetailsComponent>
33
  let userService: any
34
  let productReviewService: any
35
  let dialog: any
36
  let dialogRefMock
37

38
  beforeEach(waitForAsync(() => {
39
    userService = jasmine.createSpyObj('UserService', ['whoAmI'])
40
    userService.whoAmI.and.returnValue(of({}))
41
    productReviewService = jasmine.createSpyObj('ProductReviewService', ['get', 'create'])
42
    productReviewService.get.and.returnValue(of([]))
43
    productReviewService.create.and.returnValue(of({}))
44
    dialog = jasmine.createSpyObj('Dialog', ['open'])
45
    dialogRefMock = {
46
      afterClosed: () => of({})
47
    }
48
    dialog.open.and.returnValue(dialogRefMock)
49

50
    TestBed.configureTestingModule({
51
      imports: [
52
        TranslateModule.forRoot(),
53
        HttpClientTestingModule,
54
        ReactiveFormsModule,
55
        BrowserAnimationsModule,
56
        MatDialogModule,
57
        MatFormFieldModule,
58
        MatInputModule,
59
        MatButtonModule,
60
        MatDividerModule,
61
        MatBadgeModule,
62
        MatIconModule,
63
        MatTooltipModule,
64
        MatExpansionModule,
65
        MatSnackBarModule
66
      ],
67
      declarations: [ProductDetailsComponent],
68
      providers: [
69
        { provide: UserService, useValue: userService },
70
        { provide: ProductReviewService, useValue: productReviewService },
71
        { provide: MatDialog, useValue: dialog },
72
        { provide: MAT_DIALOG_DATA, useValue: { productData: {} } }
73
      ]
74
    })
75
      .compileComponents()
76
  }))
77

78
  beforeEach(() => {
79
    fixture = TestBed.createComponent(ProductDetailsComponent)
80
    component = fixture.componentInstance
81
    fixture.autoDetectChanges()
82
  })
83

84
  it('should create', () => {
85
    expect(component).toBeTruthy()
86
  })
87

88
  it('should post anonymous review if no user email is returned', () => {
89
    component.data = { productData: { id: 42 } as Product }
90
    userService.whoAmI.and.returnValue(of({}))
91
    component.ngOnInit()
92
    const textArea: HTMLTextAreaElement = fixture.debugElement.query(By.css('textarea')).nativeElement
93
    textArea.value = 'Great product!'
94
    const buttonDe = fixture.debugElement.query(By.css('#submitButton'))
95
    buttonDe.triggerEventHandler('click', null)
96
    const reviewObject = { message: 'Great product!', author: 'Anonymous' }
97
    expect(productReviewService.create.calls.count()).toBe(1)
98
    expect(productReviewService.create.calls.argsFor(0)[0]).toBe(42)
99
    expect(productReviewService.create.calls.argsFor(0)[1]).toEqual(reviewObject)
100
  })
101

102
  it('should post review with user email as author', () => {
103
    component.data = { productData: { id: 42 } as Product }
104
    userService.whoAmI.and.returnValue(of({ email: 'horst@juice-sh.op' }))
105
    component.ngOnInit()
106
    const textArea: HTMLTextAreaElement = fixture.debugElement.query(By.css('textarea')).nativeElement
107
    textArea.value = 'Great product!'
108
    const buttonDe = fixture.debugElement.query(By.css('#submitButton'))
109
    buttonDe.triggerEventHandler('click', null)
110
    const reviewObject = { message: 'Great product!', author: 'horst@juice-sh.op' }
111
    expect(productReviewService.create.calls.count()).toBe(1)
112
    expect(productReviewService.create.calls.argsFor(0)[0]).toBe(42)
113
    expect(productReviewService.create.calls.argsFor(0)[1]).toEqual(reviewObject)
114
  })
115

116
  it('should log errors when retrieving user directly to browser console', fakeAsync(() => {
117
    component.data = { productData: { id: 42 } as Product }
118
    userService.whoAmI.and.returnValue(throwError('Error'))
119
    console.log = jasmine.createSpy('log')
120
    component.ngOnInit()
121
    expect(console.log).toHaveBeenCalledWith('Error')
122
  }))
123

124
  it('should log errors when posting review directly to browser console', fakeAsync(() => {
125
    component.data = { productData: { id: 42 } as Product }
126
    userService.whoAmI.and.returnValue(of({}))
127
    productReviewService.create.and.returnValue(throwError('Error'))
128
    console.log = jasmine.createSpy('log')
129
    component.ngOnInit()
130
    const textArea: HTMLTextAreaElement = fixture.debugElement.query(By.css('textarea')).nativeElement
131
    textArea.value = 'Great product!'
132
    const buttonDe = fixture.debugElement.query(By.css('#submitButton'))
133
    buttonDe.triggerEventHandler('click', null)
134
    expect(console.log).toHaveBeenCalledWith('Error')
135
    fixture.destroy()
136
    flush()
137
  }))
138

139
  it('should refresh reviews after posting a review', () => {
140
    component.data = { productData: { id: 42 } as Product }
141
    productReviewService.create.and.returnValue(of({}))
142
    productReviewService.get.and.returnValue(of([{ id: '42', message: 'Review 1', author: 'Anonymous' }]))
143
    userService.whoAmI.and.returnValue(of({}))
144
    component.ngOnInit()
145
    const textArea: HTMLTextAreaElement = fixture.debugElement.query(By.css('textarea')).nativeElement
146
    textArea.value = 'Great product!'
147
    const buttonDe = fixture.debugElement.query(By.css('#submitButton'))
148
    buttonDe.triggerEventHandler('click', null)
149
    expect(productReviewService.create).toHaveBeenCalled()
150
    expect(productReviewService.get).toHaveBeenCalled()
151
  })
152

153
  it('should open a modal dialog with review editor', () => {
154
    component.data = { productData: { id: 42 } as Product }
155
    userService.whoAmI.and.returnValue(of({ email: 'horst@juice-sh.op' }))
156
    productReviewService.get.and.returnValue(of([{ id: '42', message: 'Great product!', author: 'horst@juice-sh.op' }]))
157
    component.ngOnInit()
158
    fixture.detectChanges()
159
    const buttonDe = fixture.debugElement.query(By.css('div.review-text'))
160
    buttonDe.triggerEventHandler('click', null)
161
    expect(dialog.open.calls.count()).toBe(1)
162
    expect(dialog.open.calls.argsFor(0)[0]).toBe(ProductReviewEditComponent)
163
    expect(dialog.open.calls.argsFor(0)[1].data).toEqual({ reviewData: { id: '42', message: 'Great product!', author: 'horst@juice-sh.op' } })
164
  })
165

166
  it('should refresh reviews of product after editing a review', () => {
167
    component.data = { productData: { id: 42 } as Product }
168
    userService.whoAmI.and.returnValue(of({ email: 'horst@juice-sh.op' }))
169
    productReviewService.get.and.returnValue(of([{ id: '42', message: 'Great product!', author: 'horst@juice-sh.op' }]))
170
    component.ngOnInit()
171
    fixture.detectChanges()
172
    const buttonDe = fixture.debugElement.query(By.css('div.review-text'))
173
    buttonDe.triggerEventHandler('click', null)
174
    expect(productReviewService.get).toHaveBeenCalledWith(42)
175
  })
176
})
177