From 21747180d9ae7d2afb6aa98faca5ade1950e8427 Mon Sep 17 00:00:00 2001 From: sundowndev Date: Thu, 10 Jun 2021 18:35:13 +0200 Subject: [PATCH] refactor: diffs custom style --- pkg/cmd/scan/output/assets/index.tmpl | 44 ++- pkg/cmd/scan/output/assets/style.css | 37 ++ pkg/cmd/scan/output/console.go | 2 +- pkg/cmd/scan/output/html.go | 21 ++ pkg/cmd/scan/output/html_test.go | 38 +- pkg/cmd/scan/output/testdata/output.html | 345 +++++++++++++++++- pkg/cmd/scan/output/testdata/output.txt | 4 +- .../testdata/output_computed_fields.txt | 4 +- .../scan/output/testdata/output_empty.html | 37 ++ pkg/cmd/scan/output/testdata/output_sync.html | 37 ++ 10 files changed, 536 insertions(+), 33 deletions(-) diff --git a/pkg/cmd/scan/output/assets/index.tmpl b/pkg/cmd/scan/output/assets/index.tmpl index cbe884e8..bd6def12 100644 --- a/pkg/cmd/scan/output/assets/index.tmpl +++ b/pkg/cmd/scan/output/assets/index.tmpl @@ -87,14 +87,44 @@ Resource type {{range $diff := .Differences}} -
- {{$diff.Res.TerraformId}} -
- {{range $change := $diff.Changelog}} -
{{ formatChange $change }}
- {{end}} +
+
+ {{$diff.Res.TerraformId}} + {{$diff.Res.TerraformType}} +
+
+
    + {{range $change := $diff.Changelog}} +
  1. + {{ range $index, $path := $change.Path }} +
    + {{/* Add indentation for each YAML field */}} + {{ repeatString " " $index }} + {{ if eq (isInt .) true }}-{{ else }} + {{ $path }}: + {{end}} + + {{/* If it's the last path key, display value difference */}} + {{ if eq (len $change.Path) (sum $index 1) }} + {{ if eq $change.Type "delete" }} + {{ prettify $change.From }} + {{end}} + + {{ if eq $change.Type "create" }} + {{ prettify $change.To }} + {{end}} + + {{ if eq $change.Type "update" }} + {{ prettify $change.From }} => {{ prettify $change.To }} + {{end}} +
    + {{ end }} + {{end}} +
    2. + {{end}} +
- {{$diff.Res.TerraformType}}
{{end}}
diff --git a/pkg/cmd/scan/output/assets/style.css b/pkg/cmd/scan/output/assets/style.css index a3f89e68..c45ba101 100644 --- a/pkg/cmd/scan/output/assets/style.css +++ b/pkg/cmd/scan/output/assets/style.css @@ -206,6 +206,10 @@ h2 { background-color: #f9f9f9; } +.resource-item.resource-item-changed:hover { + background-color: transparent; +} + .text--bold { font-weight: bold; } @@ -302,4 +306,37 @@ h2 { .empty-message-container { color: #747578; +} + +.code-box { + padding: 5px; + background: #f6f8fa; + color: #747578; + margin-top: 21px; + border-radius: 3px; +} + +.code-box ol { + list-style-type: none; +} + +.code-box .code-box-line { + padding: 8px; + border-radius: 2px; + margin: 10px; +} + +span.code-box-line-create { + background-color: #22863a1a; + color: #22863a; + padding: 3px; + border-radius: 3px; +} + +span.code-box-line-delete { + text-decoration: line-through; + background-color: #bf404a17; + color: #bf404a; + padding: 3px; + border-radius: 3px; } \ No newline at end of file diff --git a/pkg/cmd/scan/output/console.go b/pkg/cmd/scan/output/console.go index 870086f9..41f4a8a7 100644 --- a/pkg/cmd/scan/output/console.go +++ b/pkg/cmd/scan/output/console.go @@ -168,7 +168,7 @@ func (c Console) writeSummary(analysis *analyser.Analysis) { func prettify(resource interface{}) string { res := reflect.ValueOf(resource) if resource == nil || res.Kind() == reflect.Ptr && res.IsNil() { - return "" + return "" } return awsutil.Prettify(resource) diff --git a/pkg/cmd/scan/output/html.go b/pkg/cmd/scan/output/html.go index 5d7f903a..1eb66def 100644 --- a/pkg/cmd/scan/output/html.go +++ b/pkg/cmd/scan/output/html.go @@ -6,6 +6,7 @@ import ( "html/template" "math" "os" + "strconv" "strings" "time" @@ -100,6 +101,26 @@ func (c *HTML) Write(analysis *analyser.Analysis) error { } return math.Round(100 * float64(count) / float64(analysis.Summary().TotalResources)) }, + "isInt": func(str string) bool { + _, err := strconv.ParseInt(str, 10, 32) + if err != nil { + return false + } + return true + }, + "prettify": func(res interface{}) string { + return prettify(res) + }, + "sum": func(n ...int) int { + total := 0 + for _, v := range n { + total += v + } + return total + }, + "repeatString": func(s string, count int) template.HTML { + return template.HTML(strings.Repeat(s, count)) + }, } tmpl, err := template.New("main").Funcs(funcMap).Parse(string(tmplFile)) diff --git a/pkg/cmd/scan/output/html_test.go b/pkg/cmd/scan/output/html_test.go index a1d561a9..d6cc2215 100644 --- a/pkg/cmd/scan/output/html_test.go +++ b/pkg/cmd/scan/output/html_test.go @@ -90,15 +90,47 @@ func TestHTML_Write(t *testing.T) { }, ) a.AddDifference(analyser.Difference{Res: &testresource.FakeResource{ - Id: "diff-id-1", + Id: "diff-id-2", Type: "aws_diff_resource", }, Changelog: []analyser.Change{ { Change: diff.Change{ Type: diff.DELETE, - Path: []string{"path", "to", "field"}, + Path: []string{"path", "to", "fields", "0"}, + From: []string{"value"}, + To: nil, + }, + }, + { + Change: diff.Change{ + Type: diff.DELETE, + Path: []string{"path", "to", "fields", "1"}, + From: []string{"test"}, + To: nil, + }, + }, + { + Change: diff.Change{ + Type: diff.DELETE, + Path: []string{"group_id"}, + From: []string{"a071314398026"}, + To: nil, + }, + }, + { + Change: diff.Change{ + Type: diff.CREATE, + Path: []string{"Tags", "Name"}, From: nil, - To: []string{"value"}, + To: "aws-www-1-root", + }, + }, + { + Change: diff.Change{ + Type: diff.UPDATE, + Path: []string{"InstanceInitiatedShutdownBehavior"}, + From: "", + To: nil, }, }, }}) diff --git a/pkg/cmd/scan/output/testdata/output.html b/pkg/cmd/scan/output/testdata/output.html index 07ad79e0..e64e5f3f 100644 --- a/pkg/cmd/scan/output/testdata/output.html +++ b/pkg/cmd/scan/output/testdata/output.html @@ -214,6 +214,10 @@ h2 { background-color: #f9f9f9; } +.resource-item.resource-item-changed:hover { + background-color: transparent; +} + .text--bold { font-weight: bold; } @@ -310,6 +314,39 @@ h2 { .empty-message-container { color: #747578; +} + +.code-box { + padding: 5px; + background: #f6f8fa; + color: #747578; + margin-top: 21px; + border-radius: 3px; +} + +.code-box ol { + list-style-type: none; +} + +.code-box .code-box-line { + padding: 8px; + border-radius: 2px; + margin: 10px; +} + +span.code-box-line-create { + background-color: #22863a1a; + color: #22863a; + padding: 3px; + border-radius: 3px; +} + +span.code-box-line-delete { + text-decoration: line-through; + background-color: #bf404a17; + color: #bf404a; + padding: 3px; + border-radius: 3px; } @@ -415,28 +452,300 @@ h2 { Resource type
-
- diff-id-1 -
- -
~ updated.field: "foobar" => "barfoo"
- -
+ new.field: <nil> => "newValue"
- -
- a: "oldValue" => <nil>
- +
+
+ diff-id-1 + aws_diff_resource +
+
+
    + +
  1. + +
    + + + + updated: + + + + + +
    + +   + + field: + + + + + + + + + + "foobar" => "barfoo" + +
    + + +
    2. + +
  2. + +
    + + + + new: + + + + + +
    + +   + + field: + + + + + + + + "newValue" + + + +
    + + +
    3. + +
  3. + +
    + + + + a: + + + + + + "oldValue" + + + + + +
    + + +
    4. + +
- aws_diff_resource
-
- diff-id-1 -
- -
- path.to.field: <nil> => ["value"]
- +
+
+ diff-id-2 + aws_diff_resource +
+
+
    + +
  1. + +
    + + + + path: + + + + + +
    + +   + + to: + + + + + +
    + +    + + fields: + + + + + +
    + +     + - + + + + + ["value"] + + + + + +
    + + +
    2. + +
  2. + +
    + + + + path: + + + + + +
    + +   + + to: + + + + + +
    + +    + + fields: + + + + + +
    + +     + - + + + + + ["test"] + + + + + +
    + + +
    3. + +
  3. + +
    + + + + group_id: + + + + + + ["a071314398026"] + + + + + +
    + + +
    4. + +
  4. + +
    + + + + Tags: + + + + + +
    + +   + + Name: + + + + + + + + "aws-www-1-root" + + + +
    + + +
    5. + +
  5. + +
    + + + + InstanceInitiatedShutdownBehavior: + + + + + + + + + + "" => <null> + +
    + + +
    6. + +
- aws_diff_resource
diff --git a/pkg/cmd/scan/output/testdata/output.txt b/pkg/cmd/scan/output/testdata/output.txt index a56601c0..3f8eb409 100644 --- a/pkg/cmd/scan/output/testdata/output.txt +++ b/pkg/cmd/scan/output/testdata/output.txt @@ -16,8 +16,8 @@ Found resources not covered by IaC: Found changed resources: - diff-id-1 (aws_diff_resource): ~ updated.field: "foobar" => "barfoo" - + new.field: => "newValue" - - a: "oldValue" => + + new.field: => "newValue" + - a: "oldValue" => Found 10 resource(s) - 20% coverage - 2 covered by IaC diff --git a/pkg/cmd/scan/output/testdata/output_computed_fields.txt b/pkg/cmd/scan/output/testdata/output_computed_fields.txt index 458b8e4e..9d4033d8 100644 --- a/pkg/cmd/scan/output/testdata/output_computed_fields.txt +++ b/pkg/cmd/scan/output/testdata/output_computed_fields.txt @@ -1,8 +1,8 @@ Found changed resources: - diff-id-1 (aws_diff_resource): ~ updated.field: "foobar" => "barfoo" (computed) - + new.field: => "newValue" - - a: "oldValue" => (computed) + + new.field: => "newValue" + - a: "oldValue" => (computed) ~ struct.0.array.0: "foo" => "oof" (computed) ~ struct.0.string: "one" => "two" (computed) Found 1 resource(s) diff --git a/pkg/cmd/scan/output/testdata/output_empty.html b/pkg/cmd/scan/output/testdata/output_empty.html index a6557b72..39cb9b64 100644 --- a/pkg/cmd/scan/output/testdata/output_empty.html +++ b/pkg/cmd/scan/output/testdata/output_empty.html @@ -214,6 +214,10 @@ h2 { background-color: #f9f9f9; } +.resource-item.resource-item-changed:hover { + background-color: transparent; +} + .text--bold { font-weight: bold; } @@ -310,6 +314,39 @@ h2 { .empty-message-container { color: #747578; +} + +.code-box { + padding: 5px; + background: #f6f8fa; + color: #747578; + margin-top: 21px; + border-radius: 3px; +} + +.code-box ol { + list-style-type: none; +} + +.code-box .code-box-line { + padding: 8px; + border-radius: 2px; + margin: 10px; +} + +span.code-box-line-create { + background-color: #22863a1a; + color: #22863a; + padding: 3px; + border-radius: 3px; +} + +span.code-box-line-delete { + text-decoration: line-through; + background-color: #bf404a17; + color: #bf404a; + padding: 3px; + border-radius: 3px; } diff --git a/pkg/cmd/scan/output/testdata/output_sync.html b/pkg/cmd/scan/output/testdata/output_sync.html index f4f17d27..4408b5c2 100644 --- a/pkg/cmd/scan/output/testdata/output_sync.html +++ b/pkg/cmd/scan/output/testdata/output_sync.html @@ -214,6 +214,10 @@ h2 { background-color: #f9f9f9; } +.resource-item.resource-item-changed:hover { + background-color: transparent; +} + .text--bold { font-weight: bold; } @@ -310,6 +314,39 @@ h2 { .empty-message-container { color: #747578; +} + +.code-box { + padding: 5px; + background: #f6f8fa; + color: #747578; + margin-top: 21px; + border-radius: 3px; +} + +.code-box ol { + list-style-type: none; +} + +.code-box .code-box-line { + padding: 8px; + border-radius: 2px; + margin: 10px; +} + +span.code-box-line-create { + background-color: #22863a1a; + color: #22863a; + padding: 3px; + border-radius: 3px; +} + +span.code-box-line-delete { + text-decoration: line-through; + background-color: #bf404a17; + color: #bf404a; + padding: 3px; + border-radius: 3px; }