Consistently use lowercase HTML tag names

Unlike HTML, XHTML is case-sensitive.

src/ol/Overlay.js

@@ -132,7 +132,7 @@ class Overlay extends BaseObject {
      * @protected
      * @type {HTMLElement}
      */
-    this.element = document.createElement('DIV');
+    this.element = document.createElement('div');
     this.element.className = options.className !== undefined ?
       options.className : 'ol-overlay-container ' + CLASS_SELECTABLE;
     this.element.style.position = 'absolute';

src/ol/PluggableMap.js

@@ -244,7 +244,7 @@ class PluggableMap extends BaseObject {
      * @private
      * @type {!HTMLElement}
      */
-    this.viewport_ = document.createElement('DIV');
+    this.viewport_ = document.createElement('div');
     this.viewport_.className = 'ol-viewport' + (TOUCH ? ' ol-touch' : '');
     this.viewport_.style.position = 'relative';
     this.viewport_.style.overflow = 'hidden';
@@ -258,7 +258,7 @@ class PluggableMap extends BaseObject {
      * @private
      * @type {!HTMLElement}
      */
-    this.overlayContainer_ = document.createElement('DIV');
+    this.overlayContainer_ = document.createElement('div');
     this.overlayContainer_.className = 'ol-overlaycontainer';
     this.viewport_.appendChild(this.overlayContainer_);
 
@@ -266,7 +266,7 @@ class PluggableMap extends BaseObject {
      * @private
      * @type {!HTMLElement}
      */
-    this.overlayContainerStopEvent_ = document.createElement('DIV');
+    this.overlayContainerStopEvent_ = document.createElement('div');
     this.overlayContainerStopEvent_.className = 'ol-overlaycontainer-stopevent';
     const overlayEvents = [
       EventType.CLICK,

src/ol/control/Attribution.js

@@ -62,7 +62,7 @@ class Attribution extends Control {
      * @private
      * @type {HTMLElement}
      */
-    this.ulElement_ = document.createElement('UL');
+    this.ulElement_ = document.createElement('ul');
 
     /**
      * @private
@@ -232,7 +232,7 @@ class Attribution extends Control {
 
     // append the attributions
     for (let i = 0, ii = attributions.length; i < ii; ++i) {
-      const element = document.createElement('LI');
+      const element = document.createElement('li');
       element.innerHTML = attributions[i];
       this.ulElement_.appendChild(element);
     }

src/ol/control/MousePosition.js

@@ -55,7 +55,7 @@ class MousePosition extends Control {
 
     const options = opt_options ? opt_options : {};
 
-    const element = document.createElement('DIV');
+    const element = document.createElement('div');
     element.className = options.className !== undefined ? options.className : 'ol-mouse-position';
 
     super({

src/ol/control/OverviewMap.js

@@ -140,7 +140,7 @@ class OverviewMap extends Control {
      * @type {HTMLElement}
      * @private
      */
-    this.ovmapDiv_ = document.createElement('DIV');
+    this.ovmapDiv_ = document.createElement('div');
     this.ovmapDiv_.className = 'ol-overviewmap-map';
 
     /**
@@ -164,7 +164,7 @@ class OverviewMap extends Control {
         }).bind(this));
     }
 
-    const box = document.createElement('DIV');
+    const box = document.createElement('div');
     box.className = 'ol-overviewmap-box';
     box.style.boxSizing = 'border-box';
 

src/ol/control/ScaleLine.js

@@ -72,7 +72,7 @@ class ScaleLine extends Control {
     const className = options.className !== undefined ? options.className : 'ol-scale-line';
 
     super({
-      element: document.createElement('DIV'),
+      element: document.createElement('div'),
       render: options.render || render,
       target: options.target
     });
@@ -81,7 +81,7 @@ class ScaleLine extends Control {
      * @private
      * @type {HTMLElement}
      */
-    this.innerElement_ = document.createElement('DIV');
+    this.innerElement_ = document.createElement('div');
     this.innerElement_.className = className + '-inner';
 
     this.element.className = className + ' ' + CLASS_UNSELECTABLE;

src/ol/dom.js

@@ -10,7 +10,7 @@
  * @return {CanvasRenderingContext2D} The context.
  */
 export function createCanvasContext2D(opt_width, opt_height) {
-  const canvas = /** @type {HTMLCanvasElement} */ (document.createElement('CANVAS'));
+  const canvas = /** @type {HTMLCanvasElement} */ (document.createElement('canvas'));
   if (opt_width) {
     canvas.width = opt_width;
   }

src/ol/has.js

@@ -47,7 +47,7 @@ export const DEVICE_PIXEL_RATIO = window.devicePixelRatio || 1;
 export const CANVAS_LINE_DASH = function() {
   let has = false;
   try {
-    has = !!document.createElement('CANVAS').getContext('2d').setLineDash;
+    has = !!document.createElement('canvas').getContext('2d').setLineDash;
   } catch (e) {
     // pass
   }

src/ol/renderer/webgl/Map.js

@@ -57,7 +57,7 @@ class WebGLMapRenderer extends MapRenderer {
      * @type {HTMLCanvasElement}
      */
     this.canvas_ = /** @type {HTMLCanvasElement} */
-      (document.createElement('CANVAS'));
+      (document.createElement('canvas'));
     this.canvas_.style.width = '100%';
     this.canvas_.style.height = '100%';
     this.canvas_.style.display = 'block';

src/ol/style/IconImage.js

@@ -43,7 +43,7 @@ class IconImage extends EventTarget {
      * @type {HTMLCanvasElement}
      */
     this.canvas_ = color ?
-      /** @type {HTMLCanvasElement} */ (document.createElement('CANVAS')) :
+      /** @type {HTMLCanvasElement} */ (document.createElement('canvas')) :
       null;
 
     /**

src/ol/webgl.js

@@ -323,7 +323,7 @@ let HAS = false;
 //TODO Remove side effects
 if (typeof window !== 'undefined' && 'WebGLRenderingContext' in window) {
   try {
-    const canvas = /** @type {HTMLCanvasElement} */ (document.createElement('CANVAS'));
+    const canvas = /** @type {HTMLCanvasElement} */ (document.createElement('canvas'));
     const gl = getContext(canvas, {failIfMajorPerformanceCaveat: true});
     if (gl) {
       HAS = true;

test/spec/ol/control/control.test.js

@@ -8,7 +8,7 @@ describe('ol.control.Control', function() {
     map = new Map({
       target: document.createElement('div')
     });
-    const element = document.createElement('DIV');
+    const element = document.createElement('div');
     control = new Control({element: element});
     control.setMap(map);
   });

test/spec/ol/format/gml.test.js

@@ -14,7 +14,7 @@ import {createElementNS, parse} from '../../../../src/ol/xml.js';
 const readGeometry = function(format, text, opt_options) {
   const doc = parse(text);
   // we need an intermediate node for testing purposes
-  const node = document.createElement('PRE');
+  const node = document.createElement('pre');
   node.appendChild(doc.documentElement);
   return format.readGeometryFromNode(node, opt_options);
 };

test/spec/ol/mapbrowserevent.test.js

@@ -15,7 +15,7 @@ describe('ol.MapBrowserEventHandler', function() {
 
     beforeEach(function() {
       clock = sinon.useFakeTimers();
-      target = document.createElement('DIV');
+      target = document.createElement('div');
       handler = new MapBrowserEventHandler(new Map({
         target: target
       }));

test/test-extensions.js

@@ -397,7 +397,7 @@ import {WEBGL} from '../src/ol/has.js';
     image.addEventListener('load', function() {
       expect(image.width).to.be(width);
       expect(image.height).to.be(height);
-      const referenceCanvas = document.createElement('CANVAS');
+      const referenceCanvas = document.createElement('canvas');
       referenceCanvas.width = image.width;
       referenceCanvas.height = image.height;
       const referenceContext = referenceCanvas.getContext('2d');