bitacora/public/c3/spec/api.region-spec.ts

import { d3, initChart } from './c3-helper'

describe('c3 api region', function() {
  'use strict'

  var chart, args

  beforeEach(function(done) {
    chart = initChart(chart, args, done)
  })

  describe('api.region', function() {
    beforeAll(function() {
      args = {
        data: {
          columns: [['data1', 30, 200, 100, 400, 150, 250]]
        },
        regions: [
          {
            axis: 'y',
            start: 300,
            end: 400,
            class: 'green',
            label: 'Region 1'
          },
          {
            axis: 'y',
            start: 0,
            end: 100,
            class: 'green'
          }
        ]
      }
    })

    it('updates regions', function(done) {
      var main = chart.internal.main,
        expectedRegions = [
          {
            axis: 'y',
            start: 250,
            end: 350,
            class: 'red',
            label: 'Region 1'
          },
          {
            axis: 'y',
            start: 25,
            end: 75,
            class: 'red',
            label: ''
          }
        ],
        regions

      // Call regions API
      chart.regions(expectedRegions)
      setTimeout(function() {
        regions = main.selectAll('.c3-region')
        expect(regions.size()).toBe(expectedRegions.length)

        regions.each(function(d, i) {
          var region = d3.select(this),
            label = region.select('text'),
            y = +region.attr('y'),
            height = +region.attr('height'),
            expectedClass = 'red',
            expectedLabel = expectedRegions[i].label,
            unexpectedClass = 'green',
            expectedStart = Math.round(
              chart.internal.y(expectedRegions[i].start)
            ),
            expectedEnd = Math.round(chart.internal.y(expectedRegions[i].end)),
            expectedY = expectedEnd,
            expectedHeight = expectedStart - expectedEnd

          expect(y).toBeCloseTo(expectedY, -1)
          expect(height).toBeCloseTo(expectedHeight, -1)
          expect(region.classed(expectedClass)).toBeTruthy()
          expect(region.classed(unexpectedClass)).toBeFalsy()
          expect(label.text()).toBe(expectedLabel)
        })
      }, 500)

      setTimeout(function() {
        done()
      }, 1000)
    })
  })

  describe('api.region.add', function() {
    beforeAll(function() {
      args = {
        data: {
          columns: [['data1', 30, 200, 100, 400, 150, 250]]
        },
        regions: [
          {
            axis: 'y',
            start: 300,
            end: 400,
            class: 'green'
          },
          {
            axis: 'y',
            start: 0,
            end: 100,
            class: 'green'
          }
        ]
      }
    })

    it('should add regions', function(done) {
      var main = chart.internal.main,
        expectedRegions = [
          {
            axis: 'y',
            start: 300,
            end: 400,
            class: 'green'
          },
          {
            axis: 'y',
            start: 0,
            end: 100,
            class: 'green'
          },
          {
            axis: 'y',
            start: 250,
            end: 350,
            class: 'red'
          },
          {
            axis: 'y',
            start: 25,
            end: 75,
            class: 'red'
          }
        ],
        expectedClasses = ['green', 'green', 'red', 'red'],
        regions

      // Call regions API
      chart.regions(expectedRegions)
      setTimeout(function() {
        regions = main.selectAll('.c3-region')
        expect(regions.size()).toBe(expectedRegions.length)

        regions.each(function(d, i) {
          var region = d3.select(this),
            y = +region.attr('y'),
            height = +region.attr('height'),
            expectedClass = expectedClasses[i],
            expectedStart = Math.round(
              chart.internal.y(expectedRegions[i].start)
            ),
            expectedEnd = Math.round(chart.internal.y(expectedRegions[i].end)),
            expectedY = expectedEnd,
            expectedHeight = expectedStart - expectedEnd
          expect(y).toBeCloseTo(expectedY, -1)
          expect(height).toBeCloseTo(expectedHeight, -1)
          expect(region.classed(expectedClass)).toBeTruthy()
        })
      }, 500)

      setTimeout(function() {
        done()
      }, 1000)
    })
  })

  describe('api.region.remove', function() {
    beforeAll(function() {
      args = {
        data: {
          columns: [['data1', 30, 200, 100, 400, 150, 250]]
        },
        regions: [
          {
            axis: 'y',
            start: 300,
            end: 400,
            class: 'green'
          },
          {
            axis: 'y',
            start: 0,
            end: 100,
            class: 'green'
          },
          {
            axis: 'y',
            start: 250,
            end: 350,
            class: 'red'
          }
        ]
      }
    })

    it('should remove regions', function(done) {
      var main = chart.internal.main,
        expectedRegions = [
          {
            axis: 'y',
            start: 250,
            end: 350,
            class: 'red'
          }
        ],
        expectedClasses = ['red'],
        regions

      // Call regions API
      chart.regions(expectedRegions)
      setTimeout(function() {
        regions = main.selectAll('.c3-region')
        expect(regions.size()).toBe(expectedRegions.length)

        regions.each(function(d, i) {
          var region = d3.select(this),
            y = +region.attr('y'),
            height = +region.attr('height'),
            expectedClass = expectedClasses[i],
            expectedStart = Math.round(
              chart.internal.y(expectedRegions[i].start)
            ),
            expectedEnd = Math.round(chart.internal.y(expectedRegions[i].end)),
            expectedY = expectedEnd,
            expectedHeight = expectedStart - expectedEnd
          expect(y).toBeCloseTo(expectedY, -1)
          expect(height).toBeCloseTo(expectedHeight, -1)
          expect(region.classed(expectedClass)).toBeTruthy()
        })
      }, 500)

      setTimeout(function() {
        done()
      }, 1000)
    })
  })
})