Organize tests

test/browser/spec/ol/style/regularshape.test.js

@@ -0,0 +1,176 @@
+import Fill from '../../../../../src/ol/style/Fill.js';
+import RegularShape from '../../../../../src/ol/style/RegularShape.js';
+import Stroke from '../../../../../src/ol/style/Stroke.js';
+
+describe('ol.style.RegularShape', function () {
+  describe('#constructor', function () {
+    it('can use rotateWithView', function () {
+      const style = new RegularShape({
+        rotateWithView: true,
+        radius: 0,
+      });
+      expect(style.getRotateWithView()).to.be(true);
+    });
+
+    it('can use radius', function () {
+      const style = new RegularShape({
+        radius: 5,
+        radius2: 10,
+      });
+      expect(style.getRadius()).to.eql(5);
+      expect(style.getRadius2()).to.eql(10);
+    });
+
+    it('can use radius1 as an alias for radius', function () {
+      const style = new RegularShape({
+        radius1: 5,
+        radius2: 10,
+      });
+      expect(style.getRadius()).to.eql(5);
+      expect(style.getRadius2()).to.eql(10);
+    });
+
+    it('creates a canvas (no fill-style)', function () {
+      const style = new RegularShape({radius: 10});
+      expect(style.getImage(1)).to.be.an(HTMLCanvasElement);
+      expect(style.getSize()).to.eql([21, 21]);
+      expect(style.getImageSize()).to.eql([21, 21]);
+      expect(style.getOrigin()).to.eql([0, 0]);
+      expect(style.getAnchor()).to.eql([10.5, 10.5]);
+      // no hit-detection image is created, because no fill style is set
+      expect(style.getImage(1)).to.be(style.getHitDetectionImage());
+      expect(style.getHitDetectionImage()).to.be.an(HTMLCanvasElement);
+      expect(style.getHitDetectionImageSize()).to.eql([21, 21]);
+    });
+
+    it('creates a canvas (transparent fill-style)', function () {
+      const style = new RegularShape({
+        radius: 10,
+        fill: new Fill({
+          color: 'transparent',
+        }),
+      });
+      expect(style.getImage(1)).to.be.an(HTMLCanvasElement);
+      expect(style.getImage(1).width).to.be(21);
+      expect(style.getImage(2).width).to.be(42);
+      expect(style.getPixelRatio(2)).to.be(2);
+      expect(style.getSize()).to.eql([21, 21]);
+      expect(style.getImageSize()).to.eql([21, 21]);
+      expect(style.getOrigin()).to.eql([0, 0]);
+      expect(style.getAnchor()).to.eql([10.5, 10.5]);
+      // hit-detection image is created, because transparent fill style is set
+      expect(style.getImage(1)).to.not.be(style.getHitDetectionImage());
+      expect(style.getHitDetectionImage()).to.be.an(HTMLCanvasElement);
+      expect(style.getHitDetectionImageSize()).to.eql([21, 21]);
+      expect(style.getHitDetectionImage().width).to.be(21);
+    });
+
+    it('creates a canvas (non-transparent fill-style)', function () {
+      const style = new RegularShape({
+        radius: 10,
+        fill: new Fill({
+          color: '#FFFF00',
+        }),
+      });
+      expect(style.getImage(1)).to.be.an(HTMLCanvasElement);
+      expect(style.getSize()).to.eql([21, 21]);
+      expect(style.getImageSize()).to.eql([21, 21]);
+      expect(style.getOrigin()).to.eql([0, 0]);
+      expect(style.getAnchor()).to.eql([10.5, 10.5]);
+      // no hit-detection image is created, because non-transparent fill style is set
+      expect(style.getImage(1)).to.be(style.getHitDetectionImage());
+      expect(style.getHitDetectionImage()).to.be.an(HTMLCanvasElement);
+      expect(style.getHitDetectionImageSize()).to.eql([21, 21]);
+    });
+
+    it('sets default displacement [0, 0]', function () {
+      const style = new RegularShape({
+        radius: 5,
+      });
+      expect(style.getDisplacement()).to.an('array');
+      expect(style.getDisplacement()[0]).to.eql(0);
+      expect(style.getDisplacement()[1]).to.eql(0);
+    });
+
+    it('can use offset', function () {
+      const style = new RegularShape({
+        radius: 5,
+        displacement: [10, 20],
+      });
+      expect(style.getDisplacement()).to.an('array');
+      expect(style.getDisplacement()[0]).to.eql(10);
+      expect(style.getDisplacement()[1]).to.eql(20);
+    });
+  });
+
+  describe('#clone', function () {
+    it('creates a new ol.style.RegularShape', function () {
+      const original = new RegularShape({
+        points: 5,
+      });
+      const clone = original.clone();
+      expect(clone).to.be.an(RegularShape);
+      expect(clone).to.not.be(original);
+    });
+
+    it('copies all values', function () {
+      const original = new RegularShape({
+        fill: new Fill({
+          color: '#319FD3',
+        }),
+        points: 5,
+        radius: 4,
+        radius2: 6,
+        angle: 1,
+        stroke: new Stroke({
+          color: '#319FD3',
+        }),
+        rotation: 2,
+        rotateWithView: true,
+        displacement: [10, 20],
+      });
+      original.setOpacity(0.5);
+      original.setScale(1.5);
+      const clone = original.clone();
+      expect(original.getAngle()).to.eql(clone.getAngle());
+      expect(original.getFill().getColor()).to.eql(clone.getFill().getColor());
+      expect(original.getOpacity()).to.eql(clone.getOpacity());
+      expect(original.getPoints()).to.eql(clone.getPoints());
+      expect(original.getRadius()).to.eql(clone.getRadius());
+      expect(original.getRadius2()).to.eql(clone.getRadius2());
+      expect(original.getRotation()).to.eql(clone.getRotation());
+      expect(original.getRotateWithView()).to.eql(clone.getRotateWithView());
+      expect(original.getScale()).to.eql(clone.getScale());
+      expect(original.getStroke().getColor()).to.eql(
+        clone.getStroke().getColor()
+      );
+      expect(original.getDisplacement()[0]).to.eql(clone.getDisplacement()[0]);
+      expect(original.getDisplacement()[1]).to.eql(clone.getDisplacement()[1]);
+    });
+
+    it('the clone does not reference the same objects as the original', function () {
+      const original = new RegularShape({
+        fill: new Fill({
+          color: '#319FD3',
+        }),
+        stroke: new Stroke({
+          color: '#319FD3',
+        }),
+        displacement: [0, 5],
+      });
+      const clone = original.clone();
+      expect(original.getFill()).to.not.be(clone.getFill());
+      expect(original.getStroke()).to.not.be(clone.getStroke());
+      expect(original.getDisplacement()).to.not.be(clone.getDisplacement());
+
+      clone.getFill().setColor('#012345');
+      clone.getStroke().setColor('#012345');
+      expect(original.getFill().getColor()).to.not.eql(
+        clone.getFill().getColor()
+      );
+      expect(original.getStroke().getColor()).to.not.eql(
+        clone.getStroke().getColor()
+      );
+    });
+  });
+});