[BUG] Unrecognized scheme name: elastic when rendering vega charts

[ohltyler]

Describe the bug

I'm seeing some issue when rendering vega charts:

unrecognized scheme name: 'elastic'

It seems the color scheme reference (which is 'elastic' by default in the VegaParser), is now broken. I see vega version bump was done on 2/7, and with other changes to EUI/OUI, I wonder if some combination is what's now causing the issue. Needs further investigation.

To Reproduce
Steps to reproduce the behavior:

1. Create a vega chart
2. Try to render it

Expected behavior
It renders

OpenSearch Version
3.0.0

Dashboards Version
3.0.0

[joshuarrrr]

@ohltyler I wasn't able to reproduce:

1. I pulled latest main of OpenSearch Dashboards
2. I ran yarn osd clean and yarn osd bootstrap
3. I started the developer instance (yarn start), then loaded each of the sample datasets.
4. I went created a new Vega visualization
5. It rendered as expected, with no error messages

[ohltyler]

@joshuarrrr thanks for the further investigation - I'll take a deeper look at my env again. I was originally running into this on branches based off of feature/feature-anywhere branch which had recently rebased with main and had the latest vega changes pulled in.

[ohltyler]

I've confirmed it's related to something in the feature branch, when rendering regular line charts with vega instead of vislib. Let me triage and add to the feature anywhere meta issue.

[lezzago]

@joshuarrrr, I was able to reproduce this on a clean main branch.

Try using this configuration:

{
  $schema: https://vega.github.io/schema/vega-lite/v5.json
  data: {
    values: [
      {
        col-0-2: 1679432400000
        col-1-1: 1
      }
      {
        col-0-2: 1679434200000
        col-1-1: 5
      }
      {
        col-0-2: 1679436000000
        col-1-1: 2
      }
      {
        col-0-2: 1679437800000
        col-1-1: 1
      }
      {
        col-0-2: 1679439600000
        col-1-1: 3
      }
      {
        col-0-2: 1679441400000
        col-1-1: 3
      }
      {
        col-0-2: 1679445000000
        col-1-1: 4
      }
    ]
  }

  layer: [
    {
      mark: {
        type: line
        interpolate: linear
        strokeWidth: 2
        point: true
      }
      encoding: {
        x: {
          axis: {
            title: order_date per 30 minutes
            grid: false
          }
          field: col-0-2
          type: temporal
          scale: {
            domain: [
              1679432553582
              1679518953582
            ]
          }
        }
        y: {
          axis: {
            title: Count
            orient: left
            labels: true
            labelAngle: 0
          }
          field: col-1-1
          type: quantitative
        }
        color: {
          datum: Count
        }
      }
    }
  ]
}

With my current research, I believe the issue is on this piece:

color: {
    datum: Count
}

[joshuarrrr]

@lezzago In that sample spec, the

            domain: [
              1679432553582
              1679518953582
            ]

causes the x-axis bounds to be undefined

[lezzago]

If you remove that, you would still get the scheme name error.

{
  $schema: https://vega.github.io/schema/vega-lite/v5.json
  data: {
    values: [
      {
        col-0-2: 1679432400000
        col-1-1: 1
      }
      {
        col-0-2: 1679434200000
        col-1-1: 5
      }
      {
        col-0-2: 1679436000000
        col-1-1: 2
      }
      {
        col-0-2: 1679437800000
        col-1-1: 1
      }
      {
        col-0-2: 1679439600000
        col-1-1: 3
      }
      {
        col-0-2: 1679441400000
        col-1-1: 3
      }
      {
        col-0-2: 1679445000000
        col-1-1: 4
      }
    ]
  }

  layer: [
    {
      mark: {
        type: line
        interpolate: linear
        strokeWidth: 2
        point: true
      }
      encoding: {
        x: {
          axis: {
            title: order_date per 30 minutes
            grid: false
          }
          field: col-0-2
          type: temporal
        }
        y: {
          axis: {
            title: Count
            orient: left
            labels: true
            labelAngle: 0
          }
          field: col-1-1
          type: quantitative
        }
        color: {
          datum: Count
        }
      }
    }
  ]
}

[ohltyler]

The offending line is when setting the default color scheme in the vega parser: https://github.com/opensearch-project/OpenSearch-Dashboards/blob/main/src/plugins/vis_type_vega/public/data_model/vega_parser.ts#L680

[joshuarrrr]

Yep - I was about to post the same thing. It may be that we need to make sure we actually define vega.scheme elsewhere rather than in src/plugins/vis_type_vega/public/vega_view/vega_base_view.js

[joshuarrrr]

Here's a quick-fix PR - in theory using a schema is nice, but in practice, it seems like this was the only usage, and it's easy enough to just do it in-place to avoid bugs like this. #3663

@ohltyler @lezzago - would either of you be able to add a regression test case for this?