From 65683ab2419d4c8204a47b2d9595c7b41663ec90 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Torkel=20=C3=96degaard?= Date: Mon, 11 Jul 2016 09:38:06 +0200 Subject: [PATCH] feat(table): added sanitize html option to column styles for table panel, fixes #4596 --- pkg/plugins/dashboards_updater.go | 2 +- public/app/core/components/search/search.html | 4 ++++ .../features/plugins/partials/plugin_list.html | 4 ++++ public/app/plugins/panel/table/editor.html | 7 ++++++- public/app/plugins/panel/table/module.ts | 4 ++-- public/app/plugins/panel/table/renderer.ts | 17 +++++++++++------ .../plugins/panel/table/specs/renderer_specs.ts | 17 ++++++++++++++++- public/sass/components/_search.scss | 1 + 8 files changed, 45 insertions(+), 11 deletions(-) diff --git a/pkg/plugins/dashboards_updater.go b/pkg/plugins/dashboards_updater.go index 3036d66165b..52a623e73dd 100644 --- a/pkg/plugins/dashboards_updater.go +++ b/pkg/plugins/dashboards_updater.go @@ -12,7 +12,7 @@ func init() { } func updateAppDashboards() { - time.Sleep(time.Second * 1) + time.Sleep(time.Second * 5) plog.Debug("Looking for App Dashboard Updates") diff --git a/public/app/core/components/search/search.html b/public/app/core/components/search/search.html index 6344a26c886..b66eeffdc36 100644 --- a/public/app/core/components/search/search.html +++ b/public/app/core/components/search/search.html @@ -72,6 +72,10 @@ Import + + Explore ready made dashboards on Grafana.net + +
diff --git a/public/app/features/plugins/partials/plugin_list.html b/public/app/features/plugins/partials/plugin_list.html index 64e511805dc..f4ee2b57815 100644 --- a/public/app/features/plugins/partials/plugin_list.html +++ b/public/app/features/plugins/partials/plugin_list.html @@ -5,6 +5,10 @@

Plugins

+ + Explore plugins on Grafana.net + +
  • diff --git a/public/app/plugins/panel/table/editor.html b/public/app/plugins/panel/table/editor.html index f0fc3d70abc..d5565aa7ba1 100644 --- a/public/app/plugins/panel/table/editor.html +++ b/public/app/plugins/panel/table/editor.html @@ -103,6 +103,11 @@
+
    +
  • + +
    • +
@@ -152,7 +157,7 @@ Decimals
  • - +
    • diff --git a/public/app/plugins/panel/table/module.ts b/public/app/plugins/panel/table/module.ts index 473ce4baa48..e731b2709cf 100644 --- a/public/app/plugins/panel/table/module.ts +++ b/public/app/plugins/panel/table/module.ts @@ -45,7 +45,7 @@ class TablePanelCtrl extends MetricsPanelCtrl { }; /** @ngInject */ - constructor($scope, $injector, private annotationsSrv) { + constructor($scope, $injector, private annotationsSrv, private $sanitize) { super($scope, $injector); this.pageIndex = 0; @@ -159,7 +159,7 @@ class TablePanelCtrl extends MetricsPanelCtrl { } function appendTableRows(tbodyElem) { - var renderer = new TableRenderer(panel, data, ctrl.dashboard.isTimezoneUtc()); + var renderer = new TableRenderer(panel, data, ctrl.dashboard.isTimezoneUtc(), ctrl.$sanitize); tbodyElem.empty(); tbodyElem.html(renderer.render(ctrl.pageIndex)); } diff --git a/public/app/plugins/panel/table/renderer.ts b/public/app/plugins/panel/table/renderer.ts index 63301a37309..9544e6aa068 100644 --- a/public/app/plugins/panel/table/renderer.ts +++ b/public/app/plugins/panel/table/renderer.ts @@ -8,7 +8,7 @@ export class TableRenderer { formaters: any[]; colorState: any; - constructor(private panel, private table, private isUtc) { + constructor(private panel, private table, private isUtc, private sanitize) { this.formaters = []; this.colorState = {}; } @@ -24,7 +24,7 @@ export class TableRenderer { return _.first(style.colors); } - defaultCellFormater(v) { + defaultCellFormater(v, style) { if (v === null || v === void 0 || v === undefined) { return ''; } @@ -33,7 +33,11 @@ export class TableRenderer { v = v.join(', '); } - return v; + if (style && style.sanitize) { + return this.sanitize(v); + } else { + return _.escape(v); + } } createColumnFormater(style, column) { @@ -61,7 +65,7 @@ export class TableRenderer { } if (_.isString(v)) { - return v; + return this.defaultCellFormater(v, style); } if (style.colorMode) { @@ -72,7 +76,9 @@ export class TableRenderer { }; } - return this.defaultCellFormater; + return (value) => { + return this.defaultCellFormater(value, style); + }; } formatColumnValue(colIndex, value) { @@ -96,7 +102,6 @@ export class TableRenderer { renderCell(columnIndex, value, addWidthHack = false) { value = this.formatColumnValue(columnIndex, value); - value = _.escape(value); var style = ''; if (this.colorState.cell) { style = ' style="background-color:' + this.colorState.cell + ';color: white"'; diff --git a/public/app/plugins/panel/table/specs/renderer_specs.ts b/public/app/plugins/panel/table/specs/renderer_specs.ts index edbe136b079..0cb129df015 100644 --- a/public/app/plugins/panel/table/specs/renderer_specs.ts +++ b/public/app/plugins/panel/table/specs/renderer_specs.ts @@ -13,6 +13,7 @@ describe('when rendering table', () => { {text: 'Undefined'}, {text: 'String'}, {text: 'United', unit: 'bps'}, + {text: 'Sanitized'}, ]; var panel = { @@ -47,11 +48,20 @@ describe('when rendering table', () => { type: 'number', unit: 'ms', decimals: 2, + }, + { + pattern: 'Sanitized', + type: 'string', + sanitize: true, } ] }; - var renderer = new TableRenderer(panel, table, 'utc'); + var sanitize = function(value) { + return 'sanitized'; + }; + + var renderer = new TableRenderer(panel, table, 'utc', sanitize); it('time column should be formated', () => { var html = renderer.renderCell(0, 1388556366666); @@ -107,6 +117,11 @@ describe('when rendering table', () => { var html = renderer.renderCell(3, undefined); expect(html).to.be(''); }); + + it('sanitized value should render as', () => { + var html = renderer.renderCell(6, 'text link'); + expect(html).to.be('sanitized'); + }); }); }); diff --git a/public/sass/components/_search.scss b/public/sass/components/_search.scss index 8824c827562..ad48b29f512 100644 --- a/public/sass/components/_search.scss +++ b/public/sass/components/_search.scss @@ -101,6 +101,7 @@ .search-button-row { padding-top: 20px; + line-height: 2.5rem; button, a { margin-right: 10px; }