Color field format should apply to the whole cell in data table elast…

…ic#9834
fxprunayre · Oct 16, 2018 · 9953d6c · 9953d6c
1 parent 8fe71f8
commit 9953d6c
Show file tree

Hide file tree

Showing 2 changed files with 10 additions and 2 deletions.
diff --git a/src/core_plugins/kibana/common/field_formats/types/color.js b/src/core_plugins/kibana/common/field_formats/types/color.js
@@ -21,13 +21,14 @@ import _ from 'lodash';
 import { asPrettyString } from '../../utils/as_pretty_string';
 import { DEFAULT_COLOR } from './color_default';
 
-const convertTemplate = _.template('<span style="<%- style %>"><%- val %></span>');
+const convertTemplate = _.template('<div style="<%- style %>"><%- val %></div>');
 
 export function createColorFormat(FieldFormat) {
   class ColorFormat extends FieldFormat {
     getParamDefaults() {
       return {
         fieldType: null, // populated by editor, see controller below
+        isHtmlFormatter: true, // do not truncate this type of formatter in table cell
         colors: [_.cloneDeep(DEFAULT_COLOR)]
       };
     }

diff --git a/src/ui/public/doc_table/components/table_row.js b/src/ui/public/doc_table/components/table_row.js
@@ -208,9 +208,16 @@ module.directive('kbnTableRow', function ($compile, $httpParamSerializer, kbnUrl
        */
       function _displayField(row, fieldName, truncate) {
         const indexPattern = $scope.indexPattern;
+
+        // Some fields formatter returned value is
+        // HTML and MUST not be truncated based on formatted text length
+        const fieldFormat = indexPattern.fieldFormatMap[fieldName];
+        const isHtmlFormatter = fieldFormat !== undefined &&
+          fieldFormat.getParamDefaults().isHtmlFormatter === true;
+
         const text = indexPattern.formatField(row, fieldName);
 
-        if (truncate && text.length > MIN_LINE_LENGTH) {
+        if (!isHtmlFormatter && truncate && text.length > MIN_LINE_LENGTH) {
           return truncateByHeightTemplate({
             body: text
           });