Skip to content

Commit

Permalink
Replacing diff component (#406)
Browse files Browse the repository at this point in the history 
* Added diff component

* simplified

* another test

* replaced ngx-text-diff

* test fixen

* removed extraneous styling

* diffs should stretch to fit the space available

* diff type sigil should be selectable

* even the empty diff type sigil should be selectable

* spacesseem to get stripped

* The diff sigil column is apparent in testing

* fixed diff format
  • Loading branch information
@therealryan
therealryan authored Jun 5, 2023
1 parent 720957b commit ec40ede
Show file tree
Hide file tree
Showing 24 changed files with 1,054 additions and 236 deletions.
4 changes: 2 additions & 2 deletions ...t-core/src/test/java/com/mastercard/test/flow/report/detail/AbstractFlowSequenceTest.java
View file
Original file line number Diff line number Diff line change
Expand Up @@ -45,8 +45,8 @@ void messages() {
dseq.detail( "display=Diff", "msg=2" )
.flow()
.hasMessage(
"1 1 No, I'm worried about her dairy consumption.",
"2 2 I'm cutting you both off" );
"1 1 No, I'm worried about her dairy consumption.",
"2 2 I'm cutting you both off" );
}

/**
Expand Down
196 changes: 92 additions & 104 deletions report/report-core/src/test/java/com/mastercard/test/flow/report/diff/ModelDiffTest.java
View file
Original file line number Diff line number Diff line change
Expand Up @@ -181,62 +181,58 @@ void naturalChanges() {

dseq.change( "removed a b c" )
.hasDiff(
" 1 - Identity:",
" 2 - removed",
" 3 - a",
" 4 - b",
" 5 - c",
" 6 - Motivation:",
" 7 - ",
" 8 - Context:",
" 9 - {}",
"10 - Interactions:",
"11 - ┌REQUEST AVA => BEN []",
"12 - │Hi Ben!",
"13 - └",
"14 - ┌RESPONSE AVA <= BEN []",
"15 - │Hello Ava!",
"16 - └" );
" 1 - Identity: ",
" 2 - removed ",
" 3 - a ",
" 4 - b ",
" 5 - c ",
" 6 - Motivation: ",
" 7 - ",
" 8 - Context: ",
" 9 - {} ",
"10 - Interactions: ",
"11 - ┌REQUEST AVA => BEN [] ",
"12 - │Hi Ben! ",
"13 - └ ",
"14 - ┌RESPONSE AVA <= BEN []",
"15 - │Hello Ava! ",
"16 - └ " );

dseq.change( "added d e f" )
.hasDiff(
" 1 + Identity:",
" 2 + added",
" 3 + d",
" 4 + e",
" 5 + f",
" 6 + Motivation:",
" 7 + ",
" 8 + Context:",
" 9 + {}",
"10 + Interactions:",
"11 + ┌REQUEST AVA => BEN []",
"12 + │Hi Ben!",
"13 + └",
"14 + ┌RESPONSE AVA <= BEN []",
"15 + │Hello Ava!",
"16 + └" );
" 1 + Identity: ",
" 2 + added ",
" 3 + d ",
" 4 + e ",
" 5 + f ",
" 6 + Motivation: ",
" 7 + ",
" 8 + Context: ",
" 9 + {} ",
" 10 + Interactions: ",
" 11 + ┌REQUEST AVA => BEN [] ",
" 12 + │Hi Ben! ",
" 13 + └ ",
" 14 + ┌RESPONSE AVA <= BEN []",
" 15 + │Hello Ava! ",
" 16 + └ " );

dseq.change( "updated c d e" )
.hasDiff(
" 1 1 Identity:",
" 2 2 updated",
" 3 3 c",
" 4 4 d",
" 5 5 e",
" 6 6 Motivation:",
" 7 7 ",
" 8 8 Context:",
" 9 9 {}",
"10 10 Interactions:",
"11 11 ┌REQUEST AVA => BEN []",
"12 - │Hi Ben!",
"12 + │Hiii Beeen!",
"13 13 └",
"14 14 ┌RESPONSE AVA <= BEN []",
"15 - │Hello Ava!",
"15 + │Heeellooo Avaaa!",
"16 16 └" );
" 1 1 Identity: ",
" 2 2 updated ",
" 3 3 c ",
" 5 unchanged lines ",
" 9 9 {} ",
"10 10 Interactions: ",
"11 11 ┌REQUEST AVA => BEN [] ",
"12 - │Hi Ben! ",
" 12 + │Hiii Beeen! ",
"13 13 └ ",
"14 14 ┌RESPONSE AVA <= BEN []",
"15 - │Hello Ava! ",
" 15 + │Heeellooo Avaaa! ",
"16 16 └ " );

dseq.hasUrlArgs(
"ff=C38030BF0DCCF31DB770B2EAFA779DFC",
Expand All @@ -253,24 +249,20 @@ void naturalChanges() {
"tf=C38030BF0DCCF31DB770B2EAFA779DFC",
"to=http%253A%252F%252Flocalhost%253A" + to.port() + "%252Fto%252F" )
.hasDiff(
" 1 1 Identity:",
" 2 2 updated",
" 3 3 c",
" 4 4 d",
" 5 5 e",
" 6 6 Motivation:",
" 7 7 ",
" 8 8 Context:",
" 9 9 {}",
"10 10 Interactions:",
"11 11 ┌REQUEST AVA => BEN []",
"12 - │Hi Ben!",
"12 + │Hiii Beeen!",
"13 13 └",
"14 14 ┌RESPONSE AVA <= BEN []",
"15 - │Hello Ava!",
"15 + │Heeellooo Avaaa!",
"16 16 └" );
" 1 1 Identity: ",
" 2 2 updated ",
" 3 3 c ",
" 5 unchanged lines ",
" 9 9 {} ",
"10 10 Interactions: ",
"11 11 ┌REQUEST AVA => BEN [] ",
"12 - │Hi Ben! ",
" 12 + │Hiii Beeen! ",
"13 13 └ ",
"14 14 ┌RESPONSE AVA <= BEN []",
"15 - │Hello Ava! ",
" 15 + │Heeellooo Avaaa! ",
"16 16 └ " );
}

/**
Expand All @@ -293,22 +285,22 @@ void naturalAnalysis() {

dseq.clickDiff( 0 )
.hasDiff(
" 1 - Identity:",
" 2 - removed",
" 3 - a",
" 4 - b",
" 5 - c",
" 6 - Motivation:",
" 7 - ",
" 8 - Context:",
" 9 - {}",
"10 - Interactions:",
"11 - ┌REQUEST AVA => BEN []",
"12 - │Hi Ben!",
"13 - └",
"14 - ┌RESPONSE AVA <= BEN []",
"15 - │Hello Ava!",
"16 - └" );
" 1 - Identity: ",
" 2 - removed ",
" 3 - a ",
" 4 - b ",
" 5 - c ",
" 6 - Motivation: ",
" 7 - ",
" 8 - Context: ",
" 9 - {} ",
"10 - Interactions: ",
"11 - ┌REQUEST AVA => BEN [] ",
"12 - │Hi Ben! ",
"13 - └ ",
"14 - ┌RESPONSE AVA <= BEN []",
"15 - │Hello Ava! ",
"16 - └ " );
}

/**
Expand Down Expand Up @@ -341,26 +333,22 @@ void pairing() {
"removed ↦ added a b c d e f" )
.change( "removed ↦ added a b c d e f" )
.hasDiff(
" 1 1 Identity:",
" 2 - removed",
" 2 + added",
" 3 - a",
" 3 + d",
" 4 - b",
" 4 + e",
" 5 - c",
" 5 + f",
" 6 6 Motivation:",
" 7 7 ",
" 8 8 Context:",
" 9 9 {}",
"10 10 Interactions:",
"11 11 ┌REQUEST AVA => BEN []",
"12 12 │Hi Ben!",
"13 13 └",
"14 14 ┌RESPONSE AVA <= BEN []",
"15 15 │Hello Ava!",
"16 16 └" );
" 1 1 Identity: ",
" 2 - removed ",
" 3 - a ",
" 4 - b ",
" 5 - c ",
" 2 + added ",
" 3 + d ",
" 4 + e ",
" 5 + f ",
" 6 6 Motivation: ",
" 7 7 ",
" 8 8 Context: ",
" 5 unchanged lines ",
"14 14 ┌RESPONSE AVA <= BEN []",
"15 15 │Hello Ava! ",
"16 16 └ " );

}

Expand Down
62 changes: 41 additions & 21 deletions report/report-core/src/test/java/com/mastercard/test/flow/report/seq/DiffSequence.java
View file
Original file line number Diff line number Diff line change
Expand Up @@ -7,11 +7,12 @@
import static org.junit.jupiter.api.Assertions.assertEquals;
import static org.openqa.selenium.support.ui.ExpectedConditions.elementToBeClickable;

import java.util.ArrayList;
import java.util.Arrays;
import java.util.List;
import java.util.Map;
import java.util.regex.Matcher;
import java.util.regex.Pattern;
import java.util.stream.Collectors;
import java.util.stream.IntStream;
import java.util.stream.Stream;

import org.junit.jupiter.api.Assertions;
Expand Down Expand Up @@ -370,8 +371,6 @@ public DiffSequence change( String name ) {
return this;
}

private static final Pattern DIFF_LINE = Pattern.compile( "^([0-9]+) ([-+0-9]+) (.*)" );

/**
* Asserts on the displayed diff
*
Expand All @@ -381,25 +380,46 @@ public DiffSequence change( String name ) {
public DiffSequence hasDiff( String... expected ) {
trace( "hasDiff", (Object[]) expected );

// format the line indices so our ascii art comes out nicely
String raw = driver.findElement( By.tagName( "td-ngx-text-diff" ) )
.getText();
int liw = Stream.of( raw.split( "\n" ) )
.map( DIFF_LINE::matcher )
.filter( Matcher::matches )
.flatMap( m -> Stream.of( m.group( 1 ), m.group( 2 ) ) )
.mapToInt( String::length )
List<List<String>> tableCells = new ArrayList<>();
WebElement diffElement = driver.findElement( By.tagName( "app-text-diff" ) );
diffElement.findElements( By.tagName( "tr" ) )
.forEach( row -> tableCells.add( row.findElements( By.tagName( "td" ) ).stream()
.map( WebElement::getText )
.collect( toList() ) ) );

int[] widths = new int[tableCells.stream()
.mapToInt( List::size )
.max()
.orElse( 1 );
String fmt = "%" + liw + "s %" + liw + "s %s";

String formatted = Stream.of( raw.split( "\n" ) )
.map( line -> {
Matcher m = DIFF_LINE.matcher( line );
if( m.matches() ) {
return String.format( fmt, m.group( 1 ), m.group( 2 ), m.group( 3 ) );
.orElse( 0 )];
Arrays.fill( widths, 1 );
tableCells.forEach( row -> {
if( row.size() == widths.length ) {
for( int i = 0; i < row.size(); i++ ) {
widths[i] = Math.max( widths[i], row.get( i ).length() );
}
}
} );

int totalWidth = IntStream.of( widths ).sum() + widths.length - 1;
String fmt = IntStream.of( widths )
.limit( widths.length - 1 )
.mapToObj( i -> "%" + i + "s" )
.collect( joining( " " ) )
+ " %-" + widths[widths.length - 1] + "s";

String formatted = tableCells.stream()
.map( row -> {
if( row.size() == widths.length ) {
return String.format( fmt, row.toArray( new Object[row.size()] ) );
}
String s = row.stream().collect( joining( " " ) );
while( s.length() < totalWidth ) {
s = " " + s;
if( s.length() < totalWidth ) {
s = s + " ";
}
}
return line;
return s;
} )
.collect( joining( "\n" ) );

Expand Down
4 changes: 1 addition & 3 deletions report/report-ng/README.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -86,8 +86,6 @@ As noted above, these tests will be skipped if system property `node` is set to

## Acknowledgements

Credit for the sequence diagram on the flow detail pages belongs to [geraintluff/sequence-diagram-html](https://github.com/geraintluff/sequence-diagram-html).

The text diff component is sourced from [ABenassi87/ngx-text-diff](https://github.com/ABenassi87/ngx-text-diff).
Credit for the sequence diagram on the flow detail pages belongs to [geraintluff/sequence-diagram-html](https://github.com/geraintluff/sequence-diagram-html). A pale shadow of that work has been angularised here.

This project was generated with [Angular CLI](https://github.com/angular/angular-cli) version 12.1.2 and has since been upgraded to 14.1.2.
3 changes: 2 additions & 1 deletion report/report-ng/angular.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -100,7 +100,8 @@
],
"scripts": [
"projects/report/src/app/test-data.js",
]
],
"codeCoverage": true
}
}
}
Expand Down
1 change: 0 additions & 1 deletion report/report-ng/package.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -25,7 +25,6 @@
"@types/diff-match-patch": "^1.0.32",
"diff-match-patch": "^1.0.5",
"ngx-markdown": "^14.0.1",
"ngx-text-diff": "^0.6.0",
"rxjs": "~7.8.1",
"tslib": "^2.5.3",
"zone.js": "~0.11.4"
Expand Down
4 changes: 2 additions & 2 deletions report/report-ng/projects/report/src/app/app.module.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -32,7 +32,6 @@ import { MatTableModule } from '@angular/material/table';
import { MatTabsModule } from '@angular/material/tabs';
import { MatToolbarModule } from '@angular/material/toolbar';
import { MatTooltipModule } from '@angular/material/tooltip';
import { NgxTextDiffModule } from 'ngx-text-diff';
import { ChangeViewComponent } from './change-view/change-view.component';
import { FlowFilterComponent } from './flow-filter/flow-filter.component';
import { FlowNavItemComponent } from './flow-nav-item/flow-nav-item.component';
Expand All @@ -58,6 +57,7 @@ import { ResidueViewComponent } from './residue-view/residue-view.component';
import { MsgSearchInputComponent } from './msg-search-input/msg-search-input.component';
import { MatRipple, MatRippleModule } from '@angular/material/core';
import { HighlightedTextComponent } from './highlighted-text/highlighted-text.component';
import { TextDiffComponent } from './text-diff/text-diff.component';

const routes: Routes = [
{ path: "diff", component: ModelDiffComponent },
Expand Down Expand Up @@ -99,6 +99,7 @@ const routes: Routes = [
ResidueViewComponent,
MsgSearchInputComponent,
HighlightedTextComponent,
TextDiffComponent,
],
imports: [
BrowserAnimationsModule,
Expand All @@ -125,7 +126,6 @@ const routes: Routes = [
MatTabsModule,
MatToolbarModule,
MatTooltipModule,
NgxTextDiffModule,
ReactiveFormsModule,
RouterModule.forRoot(routes, { useHash: true }),
],
Expand Down
Loading

0 comments on commit ec40ede

Please sign in to comment.