mirror of https://github.com/grafana/grafana.git
				
				
				
			Convert `packages/grafana-ui/src/components/Logs/LogRows.test.tsx` to RTL (#48982)
* convert LogLabels tests toRTL * convert LogMessageAnsi tests to RTL * convert LogMessageAnsi to RTL fix * remove comment from LogMessageAnsi tests * convert LogRows tests to RTL * Delete LogRow import
This commit is contained in:
		
							parent
							
								
									43e34f3086
								
							
						
					
					
						commit
						b33c1bf4fd
					
				|  | @ -29,9 +29,6 @@ exports[`no enzyme tests`] = { | |||
|     "packages/grafana-ui/src/components/Logs/LogRowContextProvider.test.tsx:2719724375": [ | ||||
|       [0, 17, 13, "RegExp match", "2409514259"] | ||||
|     ], | ||||
|     "packages/grafana-ui/src/components/Logs/LogRows.test.tsx:3121815234": [ | ||||
|       [0, 17, 13, "RegExp match", "2409514259"] | ||||
|     ], | ||||
|     "packages/grafana-ui/src/components/QueryField/QueryField.test.tsx:375894800": [ | ||||
|       [0, 19, 13, "RegExp match", "2409514259"] | ||||
|     ], | ||||
|  |  | |||
|  | @ -1,16 +1,15 @@ | |||
| import { mount } from 'enzyme'; | ||||
| import { render, screen } from '@testing-library/react'; | ||||
| import { range } from 'lodash'; | ||||
| import React from 'react'; | ||||
| 
 | ||||
| import { LogLevel, LogRowModel, LogsDedupStrategy, MutableDataFrame, LogsSortOrder } from '@grafana/data'; | ||||
| 
 | ||||
| import { LogRow } from './LogRow'; | ||||
| import { LogRows, PREVIEW_LIMIT } from './LogRows'; | ||||
| 
 | ||||
| describe('LogRows', () => { | ||||
|   it('renders rows', () => { | ||||
|     const rows: LogRowModel[] = [makeLog({ uid: '1' }), makeLog({ uid: '2' }), makeLog({ uid: '3' })]; | ||||
|     const wrapper = mount( | ||||
|     render( | ||||
|       <LogRows | ||||
|         logRows={rows} | ||||
|         dedupStrategy={LogsDedupStrategy.none} | ||||
|  | @ -23,16 +22,16 @@ describe('LogRows', () => { | |||
|       /> | ||||
|     ); | ||||
| 
 | ||||
|     expect(wrapper.find(LogRow).length).toBe(3); | ||||
|     expect(wrapper.contains('log message 1')).toBeTruthy(); | ||||
|     expect(wrapper.contains('log message 2')).toBeTruthy(); | ||||
|     expect(wrapper.contains('log message 3')).toBeTruthy(); | ||||
|     expect(screen.queryAllByRole('row')).toHaveLength(3); | ||||
|     expect(screen.queryAllByRole('row').at(0)).toHaveTextContent('log message 1'); | ||||
|     expect(screen.queryAllByRole('row').at(1)).toHaveTextContent('log message 2'); | ||||
|     expect(screen.queryAllByRole('row').at(2)).toHaveTextContent('log message 3'); | ||||
|   }); | ||||
| 
 | ||||
|   it('renders rows only limited number of rows first', () => { | ||||
|     const rows: LogRowModel[] = [makeLog({ uid: '1' }), makeLog({ uid: '2' }), makeLog({ uid: '3' })]; | ||||
|     jest.useFakeTimers('modern'); | ||||
|     const wrapper = mount( | ||||
|     const { rerender } = render( | ||||
|       <LogRows | ||||
|         logRows={rows} | ||||
|         dedupStrategy={LogsDedupStrategy.none} | ||||
|  | @ -46,15 +45,29 @@ describe('LogRows', () => { | |||
|       /> | ||||
|     ); | ||||
| 
 | ||||
|     expect(wrapper.find(LogRow).length).toBe(1); | ||||
|     expect(wrapper.contains('log message 1')).toBeTruthy(); | ||||
|     jest.runAllTimers(); | ||||
|     wrapper.update(); | ||||
|     // There is an extra row with the rows that are rendering
 | ||||
|     expect(screen.queryAllByRole('row')).toHaveLength(2); | ||||
|     expect(screen.queryAllByRole('row').at(0)).toHaveTextContent('log message 1'); | ||||
| 
 | ||||
|     expect(wrapper.find(LogRow).length).toBe(3); | ||||
|     expect(wrapper.contains('log message 1')).toBeTruthy(); | ||||
|     expect(wrapper.contains('log message 2')).toBeTruthy(); | ||||
|     expect(wrapper.contains('log message 3')).toBeTruthy(); | ||||
|     jest.runAllTimers(); | ||||
|     rerender( | ||||
|       <LogRows | ||||
|         logRows={rows} | ||||
|         dedupStrategy={LogsDedupStrategy.none} | ||||
|         showLabels={false} | ||||
|         showTime={false} | ||||
|         wrapLogMessage={true} | ||||
|         prettifyLogMessage={true} | ||||
|         timeZone={'utc'} | ||||
|         previewLimit={1} | ||||
|         enableLogDetails={true} | ||||
|       /> | ||||
|     ); | ||||
| 
 | ||||
|     expect(screen.queryAllByRole('row')).toHaveLength(3); | ||||
|     expect(screen.queryAllByRole('row').at(0)).toHaveTextContent('log message 1'); | ||||
|     expect(screen.queryAllByRole('row').at(1)).toHaveTextContent('log message 2'); | ||||
|     expect(screen.queryAllByRole('row').at(2)).toHaveTextContent('log message 3'); | ||||
| 
 | ||||
|     jest.useRealTimers(); | ||||
|   }); | ||||
|  | @ -62,7 +75,7 @@ describe('LogRows', () => { | |||
|   it('renders deduped rows if supplied', () => { | ||||
|     const rows: LogRowModel[] = [makeLog({ uid: '1' }), makeLog({ uid: '2' }), makeLog({ uid: '3' })]; | ||||
|     const dedupedRows: LogRowModel[] = [makeLog({ uid: '4' }), makeLog({ uid: '5' })]; | ||||
|     const wrapper = mount( | ||||
|     render( | ||||
|       <LogRows | ||||
|         logRows={rows} | ||||
|         deduplicatedRows={dedupedRows} | ||||
|  | @ -75,16 +88,15 @@ describe('LogRows', () => { | |||
|         enableLogDetails={true} | ||||
|       /> | ||||
|     ); | ||||
| 
 | ||||
|     expect(wrapper.find(LogRow).length).toBe(2); | ||||
|     expect(wrapper.contains('log message 4')).toBeTruthy(); | ||||
|     expect(wrapper.contains('log message 5')).toBeTruthy(); | ||||
|     expect(screen.queryAllByRole('row')).toHaveLength(2); | ||||
|     expect(screen.queryAllByRole('row').at(0)).toHaveTextContent('log message 4'); | ||||
|     expect(screen.queryAllByRole('row').at(1)).toHaveTextContent('log message 5'); | ||||
|   }); | ||||
| 
 | ||||
|   it('renders with default preview limit', () => { | ||||
|     // PREVIEW_LIMIT * 2 is there because otherwise we just render all rows
 | ||||
|     const rows: LogRowModel[] = range(PREVIEW_LIMIT * 2 + 1).map((num) => makeLog({ uid: num.toString() })); | ||||
|     const wrapper = mount( | ||||
|     render( | ||||
|       <LogRows | ||||
|         logRows={rows} | ||||
|         dedupStrategy={LogsDedupStrategy.none} | ||||
|  | @ -97,7 +109,8 @@ describe('LogRows', () => { | |||
|       /> | ||||
|     ); | ||||
| 
 | ||||
|     expect(wrapper.find(LogRow).length).toBe(100); | ||||
|     // There is an extra row with the rows that are rendering
 | ||||
|     expect(screen.queryAllByRole('row')).toHaveLength(101); | ||||
|   }); | ||||
| 
 | ||||
|   it('renders asc ordered rows if order and function supplied', () => { | ||||
|  | @ -106,7 +119,7 @@ describe('LogRows', () => { | |||
|       makeLog({ uid: '3', timeEpochMs: 3 }), | ||||
|       makeLog({ uid: '2', timeEpochMs: 2 }), | ||||
|     ]; | ||||
|     const wrapper = mount( | ||||
|     render( | ||||
|       <LogRows | ||||
|         logRows={rows} | ||||
|         dedupStrategy={LogsDedupStrategy.none} | ||||
|  | @ -120,9 +133,9 @@ describe('LogRows', () => { | |||
|       /> | ||||
|     ); | ||||
| 
 | ||||
|     expect(wrapper.find(LogRow).at(0).text()).toBe('log message 1'); | ||||
|     expect(wrapper.find(LogRow).at(1).text()).toBe('log message 2'); | ||||
|     expect(wrapper.find(LogRow).at(2).text()).toBe('log message 3'); | ||||
|     expect(screen.queryAllByRole('row').at(0)).toHaveTextContent('log message 1'); | ||||
|     expect(screen.queryAllByRole('row').at(1)).toHaveTextContent('log message 2'); | ||||
|     expect(screen.queryAllByRole('row').at(2)).toHaveTextContent('log message 3'); | ||||
|   }); | ||||
|   it('renders desc ordered rows if order and function supplied', () => { | ||||
|     const rows: LogRowModel[] = [ | ||||
|  | @ -130,7 +143,7 @@ describe('LogRows', () => { | |||
|       makeLog({ uid: '3', timeEpochMs: 3 }), | ||||
|       makeLog({ uid: '2', timeEpochMs: 2 }), | ||||
|     ]; | ||||
|     const wrapper = mount( | ||||
|     render( | ||||
|       <LogRows | ||||
|         logRows={rows} | ||||
|         dedupStrategy={LogsDedupStrategy.none} | ||||
|  | @ -144,9 +157,9 @@ describe('LogRows', () => { | |||
|       /> | ||||
|     ); | ||||
| 
 | ||||
|     expect(wrapper.find(LogRow).at(0).text()).toBe('log message 3'); | ||||
|     expect(wrapper.find(LogRow).at(1).text()).toBe('log message 2'); | ||||
|     expect(wrapper.find(LogRow).at(2).text()).toBe('log message 1'); | ||||
|     expect(screen.queryAllByRole('row').at(0)).toHaveTextContent('log message 3'); | ||||
|     expect(screen.queryAllByRole('row').at(1)).toHaveTextContent('log message 2'); | ||||
|     expect(screen.queryAllByRole('row').at(2)).toHaveTextContent('log message 1'); | ||||
|   }); | ||||
| }); | ||||
| 
 | ||||
|  |  | |||
		Loading…
	
		Reference in New Issue