Merge pull request #8804 from notnotse/issue/8621-disable-collapsible-attributions-for-osm

Add possibility to disable collapsible attributions from Source

changelog/upgrade-notes.md

@@ -2,6 +2,12 @@
 
 ### Next version
 
+#### Attributions are not collapsible for `ol/source/OSM`
+
+When a map contains a layer from a `ol/source/OSM` source, the `ol/control/Attribution` control will be shown with the `collapsible: false` behavior.
+
+To get the previous behavior, configure the `ol/control/Attribution` control with `collapsible: true`. 
+
 ### v5.2.0
 
 #### Removal of the `snapToPixel` option for `ol/style/Image` subclasses

examples/accessible.js

@@ -1,6 +1,5 @@
 import Map from '../src/ol/Map.js';
 import View from '../src/ol/View.js';
-import {defaults as defaultControls} from '../src/ol/control.js';
 import TileLayer from '../src/ol/layer/Tile.js';
 import OSM from '../src/ol/source/OSM.js';
 
@@ -12,11 +11,6 @@ const map = new Map({
     })
   ],
   target: 'map',
-  controls: defaultControls({
-    attributionOptions: {
-      collapsible: false
-    }
-  }),
   view: new View({
     center: [0, 0],
     zoom: 2

examples/canvas-tiles.js

@@ -1,6 +1,5 @@
 import Map from '../src/ol/Map.js';
 import View from '../src/ol/View.js';
-import {defaults as defaultControls} from '../src/ol/control.js';
 import TileLayer from '../src/ol/layer/Tile.js';
 import {fromLonLat} from '../src/ol/proj.js';
 import {OSM, TileDebug} from '../src/ol/source.js';
@@ -20,11 +19,6 @@ const map = new Map({
     })
   ],
   target: 'map',
-  controls: defaultControls({
-    attributionOptions: {
-      collapsible: false
-    }
-  }),
   view: new View({
     center: fromLonLat([-0.1275, 51.507222]),
     zoom: 10

examples/center.js

@@ -1,6 +1,5 @@
 import Map from '../src/ol/Map.js';
 import View from '../src/ol/View.js';
-import {defaults as defaultControls} from '../src/ol/control.js';
 import GeoJSON from '../src/ol/format/GeoJSON.js';
 import {Tile as TileLayer, Vector as VectorLayer} from '../src/ol/layer.js';
 import {OSM, Vector as VectorSource} from '../src/ol/source.js';
@@ -45,11 +44,6 @@ const map = new Map({
     vectorLayer
   ],
   target: 'map',
-  controls: defaultControls({
-    attributionOptions: {
-      collapsible: false
-    }
-  }),
   view: view
 });
 

examples/custom-controls.js

@@ -48,11 +48,7 @@ class RotateNorthControl extends Control {
 
 
 const map = new Map({
-  controls: defaultControls({
+  controls: defaultControls().extend([
-    attributionOptions: {
-      collapsible: false
-    }
-  }).extend([
     new RotateNorthControl()
   ]),
   layers: [

examples/device-orientation.js

@@ -1,6 +1,5 @@
 import Map from '../src/ol/Map.js';
 import View from '../src/ol/View.js';
-import {defaults as defaultControls} from '../src/ol/control.js';
 import TileLayer from '../src/ol/layer/Tile.js';
 import {toRadians} from '../src/ol/math.js';
 import OSM from '../src/ol/source/OSM.js';
@@ -16,11 +15,6 @@ const map = new Map({
     })
   ],
   target: 'map',
-  controls: defaultControls({
-    attributionOptions: {
-      collapsible: false
-    }
-  }),
   view: view
 });
 

examples/export-map.js

@@ -1,6 +1,5 @@
 import Map from '../src/ol/Map.js';
 import View from '../src/ol/View.js';
-import {defaults as defaultControls} from '../src/ol/control.js';
 import GeoJSON from '../src/ol/format/GeoJSON.js';
 import {Tile as TileLayer, Vector as VectorLayer} from '../src/ol/layer.js';
 import {OSM, Vector as VectorSource} from '../src/ol/source.js';
@@ -18,11 +17,6 @@ const map = new Map({
     })
   ],
   target: 'map',
-  controls: defaultControls({
-    attributionOptions: {
-      collapsible: false
-    }
-  }),
   view: new View({
     center: [0, 0],
     zoom: 2

examples/export-pdf.js

@@ -1,6 +1,5 @@
 import Map from '../src/ol/Map.js';
 import View from '../src/ol/View.js';
-import {defaults as defaultControls} from '../src/ol/control.js';
 import WKT from '../src/ol/format/WKT.js';
 import {Tile as TileLayer, Vector as VectorLayer} from '../src/ol/layer.js';
 import {OSM, Vector as VectorSource} from '../src/ol/source.js';
@@ -26,11 +25,6 @@ const vector = new VectorLayer({
 const map = new Map({
   layers: [raster, vector],
   target: 'map',
-  controls: defaultControls({
-    attributionOptions: {
-      collapsible: false
-    }
-  }),
   view: new View({
     center: [0, 0],
     zoom: 2

examples/feature-animation.js

@@ -2,7 +2,6 @@ import Feature from '../src/ol/Feature.js';
 import Map from '../src/ol/Map.js';
 import {unByKey} from '../src/ol/Observable.js';
 import View from '../src/ol/View.js';
-import {defaults as defaultControls} from '../src/ol/control.js';
 import {easeOut} from '../src/ol/easing.js';
 import Point from '../src/ol/geom/Point.js';
 import {Tile as TileLayer, Vector as VectorLayer} from '../src/ol/layer.js';
@@ -19,11 +18,6 @@ const map = new Map({
       })
     })
   ],
-  controls: defaultControls({
-    attributionOptions: {
-      collapsible: false
-    }
-  }),
   target: 'map',
   view: new View({
     center: [0, 0],

examples/geojson.js

@@ -1,7 +1,6 @@
 import Feature from '../src/ol/Feature.js';
 import Map from '../src/ol/Map.js';
 import View from '../src/ol/View.js';
-import {defaults as defaultControls} from '../src/ol/control.js';
 import GeoJSON from '../src/ol/format/GeoJSON.js';
 import Circle from '../src/ol/geom/Circle.js';
 import {Tile as TileLayer, Vector as VectorLayer} from '../src/ol/layer.js';
@@ -174,11 +173,6 @@ const map = new Map({
     vectorLayer
   ],
   target: 'map',
-  controls: defaultControls({
-    attributionOptions: {
-      collapsible: false
-    }
-  }),
   view: new View({
     center: [0, 0],
     zoom: 2

examples/geolocation-orientation.js

@@ -2,7 +2,6 @@ import Geolocation from '../src/ol/Geolocation.js';
 import Map from '../src/ol/Map.js';
 import Overlay from '../src/ol/Overlay.js';
 import View from '../src/ol/View.js';
-import {defaults as defaultControls} from '../src/ol/control.js';
 import LineString from '../src/ol/geom/LineString.js';
 import TileLayer from '../src/ol/layer/Tile.js';
 import {fromLonLat} from '../src/ol/proj.js';
@@ -22,11 +21,6 @@ const map = new Map({
     })
   ],
   target: 'map',
-  controls: defaultControls({
-    attributionOptions: {
-      collapsible: false
-    }
-  }),
   view: view
 });
 

examples/geolocation.js

@@ -2,7 +2,6 @@ import Feature from '../src/ol/Feature.js';
 import Geolocation from '../src/ol/Geolocation.js';
 import Map from '../src/ol/Map.js';
 import View from '../src/ol/View.js';
-import {defaults as defaultControls} from '../src/ol/control.js';
 import Point from '../src/ol/geom/Point.js';
 import {Tile as TileLayer, Vector as VectorLayer} from '../src/ol/layer.js';
 import {OSM, Vector as VectorSource} from '../src/ol/source.js';
@@ -20,11 +19,6 @@ const map = new Map({
     })
   ],
   target: 'map',
-  controls: defaultControls({
-    attributionOptions: {
-      collapsible: false
-    }
-  }),
   view: view
 });
 

examples/igc.js

@@ -1,7 +1,6 @@
 import Feature from '../src/ol/Feature.js';
 import Map from '../src/ol/Map.js';
 import View from '../src/ol/View.js';
-import {defaults as defaultControls} from '../src/ol/control.js';
 import IGC from '../src/ol/format/IGC.js';
 import {LineString, Point} from '../src/ol/geom.js';
 import {Tile as TileLayer, Vector as VectorLayer} from '../src/ol/layer.js';
@@ -93,11 +92,6 @@ const map = new Map({
     })
   ],
   target: 'map',
-  controls: defaultControls({
-    attributionOptions: {
-      collapsible: false
-    }
-  }),
   view: new View({
     center: [703365.7089403362, 5714629.865071137],
     zoom: 9

examples/layer-clipping-webgl.js

@@ -1,6 +1,5 @@
 import Map from '../src/ol/WebGLMap.js';
 import View from '../src/ol/View.js';
-import {defaults as defaultControls} from '../src/ol/control.js';
 import {WEBGL} from '../src/ol/has.js';
 import TileLayer from '../src/ol/layer/Tile.js';
 import OSM from '../src/ol/source/OSM.js';
@@ -20,11 +19,6 @@ if (!WEBGL) {
   const map = new Map({
     layers: [osm],
     target: 'map',
-    controls: defaultControls({
-      attributionOptions: {
-        collapsible: false
-      }
-    }),
     view: new View({
       center: [0, 0],
       zoom: 2

examples/layer-clipping.js

@@ -1,6 +1,5 @@
 import Map from '../src/ol/Map.js';
 import View from '../src/ol/View.js';
-import {defaults as defaultControls} from '../src/ol/control.js';
 import TileLayer from '../src/ol/layer/Tile.js';
 import OSM from '../src/ol/source/OSM.js';
 
@@ -11,11 +10,6 @@ const osm = new TileLayer({
 const map = new Map({
   layers: [osm],
   target: 'map',
-  controls: defaultControls({
-    attributionOptions: {
-      collapsible: false
-    }
-  }),
   view: new View({
     center: [0, 0],
     zoom: 2

examples/layer-swipe.js

@@ -1,6 +1,5 @@
 import Map from '../src/ol/Map.js';
 import View from '../src/ol/View.js';
-import {defaults as defaultControls} from '../src/ol/control.js';
 import TileLayer from '../src/ol/layer/Tile.js';
 import BingMaps from '../src/ol/source/BingMaps.js';
 import OSM from '../src/ol/source/OSM.js';
@@ -18,11 +17,6 @@ const bing = new TileLayer({
 const map = new Map({
   layers: [osm, bing],
   target: 'map',
-  controls: defaultControls({
-    attributionOptions: {
-      collapsible: false
-    }
-  }),
   view: new View({
     center: [0, 0],
     zoom: 2

examples/localized-openstreetmap.js

@@ -1,6 +1,5 @@
 import Map from '../src/ol/Map.js';
 import View from '../src/ol/View.js';
-import {defaults as defaultControls} from '../src/ol/control.js';
 import TileLayer from '../src/ol/layer/Tile.js';
 import OSM, {ATTRIBUTION} from '../src/ol/source/OSM.js';
 
@@ -34,11 +33,6 @@ const map = new Map({
     openSeaMapLayer
   ],
   target: 'map',
-  controls: defaultControls({
-    attributionOptions: {
-      collapsible: false
-    }
-  }),
   view: new View({
     maxZoom: 18,
     center: [-244780.24508882355, 5986452.183179816],

examples/min-max-resolution.js

@@ -1,6 +1,5 @@
 import Map from '../src/ol/Map.js';
 import View from '../src/ol/View.js';
-import {defaults as defaultControls} from '../src/ol/control.js';
 import TileLayer from '../src/ol/layer/Tile.js';
 import OSM from '../src/ol/source/OSM.js';
 import TileJSON from '../src/ol/source/TileJSON.js';
@@ -26,11 +25,6 @@ const map = new Map({
     })
   ],
   target: 'map',
-  controls: defaultControls({
-    attributionOptions: {
-      collapsible: false
-    }
-  }),
   view: new View({
     center: [653600, 5723680],
     zoom: 5

examples/mouse-position.js

@@ -17,11 +17,7 @@ const mousePositionControl = new MousePosition({
 });
 
 const map = new Map({
-  controls: defaultControls({
+  controls: defaultControls().extend([mousePositionControl]),
-    attributionOptions: {
-      collapsible: false
-    }
-  }).extend([mousePositionControl]),
   layers: [
     new TileLayer({
       source: new OSM()

examples/moveend.js

@@ -1,6 +1,5 @@
 import Map from '../src/ol/Map.js';
 import View from '../src/ol/View.js';
-import {defaults as defaultControls} from '../src/ol/control.js';
 import {getBottomLeft, getTopRight} from '../src/ol/extent.js';
 import TileLayer from '../src/ol/layer/Tile.js';
 import {toLonLat} from '../src/ol/proj.js';
@@ -14,11 +13,6 @@ const map = new Map({
     })
   ],
   target: 'map',
-  controls: defaultControls({
-    attributionOptions: {
-      collapsible: false
-    }
-  }),
   view: new View({
     center: [0, 0],
     zoom: 2

examples/navigation-controls.js

@@ -6,11 +6,7 @@ import OSM from '../src/ol/source/OSM.js';
 
 
 const map = new Map({
-  controls: defaultControls({
+  controls: defaultControls().extend([
-    attributionOptions: {
-      collapsible: false
-    }
-  }).extend([
     new ZoomToExtent({
       extent: [
         813079.7791264898, 5929220.284081122,

examples/permalink.js

@@ -1,6 +1,5 @@
 import Map from '../src/ol/Map.js';
 import View from '../src/ol/View.js';
-import {defaults as defaultControls} from '../src/ol/control.js';
 import TileLayer from '../src/ol/layer/Tile.js';
 import OSM from '../src/ol/source/OSM.js';
 
@@ -29,11 +28,6 @@ const map = new Map({
       source: new OSM()
     })
   ],
-  controls: defaultControls({
-    attributionOptions: {
-      collapsible: false
-    }
-  }),
   target: 'map',
   view: new View({
     center: center,

examples/rotation.js

@@ -1,6 +1,5 @@
 import Map from '../src/ol/Map.js';
 import View from '../src/ol/View.js';
-import {defaults as defaultControls} from '../src/ol/control.js';
 import TileLayer from '../src/ol/layer/Tile.js';
 import OSM from '../src/ol/source/OSM.js';
 
@@ -12,11 +11,6 @@ const map = new Map({
     })
   ],
   target: 'map',
-  controls: defaultControls({
-    attributionOptions: {
-      collapsible: false
-    }
-  }),
   view: new View({
     center: [14200000, 4130000],
     rotation: Math.PI / 6,

examples/scale-line.js

@@ -8,11 +8,7 @@ import OSM from '../src/ol/source/OSM.js';
 const scaleLineControl = new ScaleLine();
 
 const map = new Map({
-  controls: defaultControls({
+  controls: defaultControls().extend([
-    attributionOptions: {
-      collapsible: false
-    }
-  }).extend([
     scaleLineControl
   ]),
   layers: [

examples/teleport.js

@@ -1,6 +1,5 @@
 import Map from '../src/ol/Map.js';
 import View from '../src/ol/View.js';
-import {defaults as defaultControls} from '../src/ol/control.js';
 import TileLayer from '../src/ol/layer/Tile.js';
 import OSM from '../src/ol/source/OSM.js';
 
@@ -11,11 +10,6 @@ const map = new Map({
       source: new OSM()
     })
   ],
-  controls: defaultControls({
-    attributionOptions: {
-      collapsible: false
-    }
-  }),
   view: new View({
     center: [0, 0],
     zoom: 2

examples/vector-osm.js

@@ -1,6 +1,5 @@
 import Map from '../src/ol/Map.js';
 import View from '../src/ol/View.js';
-import {defaults as defaultControls} from '../src/ol/control.js';
 import OSMXML from '../src/ol/format/OSMXML.js';
 import {Tile as TileLayer, Vector as VectorLayer} from '../src/ol/layer.js';
 import {bbox as bboxStrategy} from '../src/ol/loadingstrategy.js';
@@ -121,11 +120,6 @@ const raster = new TileLayer({
 map = new Map({
   layers: [raster, vector],
   target: document.getElementById('map'),
-  controls: defaultControls({
-    attributionOptions: {
-      collapsible: false
-    }
-  }),
   view: new View({
     center: [739218, 5906096],
     maxZoom: 19,

examples/wmts-ign.js

@@ -1,6 +1,5 @@
 import Map from '../src/ol/Map.js';
 import View from '../src/ol/View.js';
-import {defaults as defaultControls} from '../src/ol/control.js';
 import {getWidth} from '../src/ol/extent.js';
 import TileLayer from '../src/ol/layer/Tile.js';
 import {fromLonLat, get as getProjection} from '../src/ol/proj.js';
@@ -10,11 +9,6 @@ import WMTSTileGrid from '../src/ol/tilegrid/WMTS.js';
 
 const map = new Map({
   target: 'map',
-  controls: defaultControls({
-    attributionOptions: {
-      collapsible: false
-    }
-  }),
   view: new View({
     zoom: 5,
     center: fromLonLat([5, 45])

examples/wmts.js

@@ -1,6 +1,5 @@
 import Map from '../src/ol/Map.js';
 import View from '../src/ol/View.js';
-import {defaults as defaultControls} from '../src/ol/control.js';
 import {getWidth, getTopLeft} from '../src/ol/extent.js';
 import TileLayer from '../src/ol/layer/Tile.js';
 import {get as getProjection} from '../src/ol/proj.js';
@@ -48,11 +47,6 @@ const map = new Map({
     })
   ],
   target: 'map',
-  controls: defaultControls({
-    attributionOptions: {
-      collapsible: false
-    }
-  }),
   view: new View({
     center: [-11158582, 4813697],
     zoom: 4

src/ol/control/Attribution.js

@@ -16,9 +16,9 @@ import {visibleAtResolution} from '../layer/Layer.js';
  * @property {HTMLElement|string} [target] Specify a target if you
  * want the control to be rendered outside of the map's
  * viewport.
- * @property {boolean} [collapsible=true] Specify if attributions can
+ * @property {boolean} [collapsible] Specify if attributions can
- * be collapsed. If you use an OSM source, should be set to `false` — see
+ * be collapsed. If not specified, sources control this behavior with their
- * {@link https://www.openstreetmap.org/copyright OSM Copyright} —
+ * `attributionsCollapsible` setting.
  * @property {boolean} [collapsed=true] Specify if attributions should
  * be collapsed at startup.
  * @property {string} [tipLabel='Attributions'] Text label to use for the button tip.
@@ -70,6 +70,12 @@ class Attribution extends Control {
      */
     this.collapsed_ = options.collapsed !== undefined ? options.collapsed : true;
 
+    /**
+     * @private
+     * @type {boolean}
+     */
+    this.overrideCollapsible_ = options.collapsible !== undefined;
+
     /**
      * @private
      * @type {boolean}
@@ -145,12 +151,12 @@ class Attribution extends Control {
   }
 
   /**
-   * Get a list of visible attributions.
+   * Collect a list of visible attributions and set the collapsible state.
    * @param {import("../PluggableMap.js").FrameState} frameState Frame state.
    * @return {Array<string>} Attributions.
    * @private
    */
-  getSourceAttributions_(frameState) {
+  collectSourceAttributions_(frameState) {
     /**
      * Used to determine if an attribution already exists.
      * @type {!Object<string, boolean>}
@@ -186,6 +192,10 @@ class Attribution extends Control {
         continue;
       }
 
+      if (!this.overrideCollapsible_ && source.getAttributionsCollapsible() === false) {
+        this.setCollapsible(false);
+      }
+
       if (Array.isArray(attributions)) {
         for (let j = 0, jj = attributions.length; j < jj; ++j) {
           if (!(attributions[j] in lookup)) {
@@ -216,7 +226,7 @@ class Attribution extends Control {
       return;
     }
 
-    const attributions = this.getSourceAttributions_(frameState);
+    const attributions = this.collectSourceAttributions_(frameState);
 
     const visible = attributions.length > 0;
     if (this.renderedVisible_ != visible) {

src/ol/source/OSM.js

@@ -76,7 +76,8 @@ class OSM extends XYZ {
       reprojectionErrorThreshold: options.reprojectionErrorThreshold,
       tileLoadFunction: options.tileLoadFunction,
       url: url,
-      wrapX: options.wrapX
+      wrapX: options.wrapX,
+      attributionsCollapsible: false
     });
 
   }

src/ol/source/Source.js

@@ -31,6 +31,7 @@ import SourceState from './State.js';
 /**
  * @typedef {Object} Options
  * @property {AttributionLike} [attributions]
+ * @property {boolean} [attributionsCollapsible=true] Attributions are collapsible.
  * @property {import("../proj.js").ProjectionLike} projection
  * @property {SourceState} [state='ready']
  * @property {boolean} [wrapX=false]
@@ -66,6 +67,13 @@ class Source extends BaseObject {
      */
     this.attributions_ = adaptAttributions(options.attributions);
 
+    /**
+     * @private
+     * @type {boolean}
+     */
+    this.attributionsCollapsible_ = options.attributionsCollapsible !== undefined ?
+      options.attributionsCollapsible : true;
+
     /**
      * This source is currently loading data. Sources that defer loading to the
      * map's tile queue never set this to `true`.
@@ -96,6 +104,13 @@ class Source extends BaseObject {
     return this.attributions_;
   }
 
+  /**
+   * @return {boolean} Aattributions are collapsible.
+   */
+  getAttributionsCollapsible() {
+    return this.attributionsCollapsible_;
+  }
+
   /**
    * Get the projection of the source.
    * @return {import("../proj/Projection.js").default} Projection.

src/ol/source/Tile.js

@@ -14,6 +14,7 @@ import {wrapX, getForProjection as getTileGridForProjection} from '../tilegrid.j
 /**
  * @typedef {Object} Options
  * @property {import("./Source.js").AttributionLike} [attributions]
+ * @property {boolean} [attributionsCollapsible=true] Attributions are collapsible.
  * @property {number} [cacheSize]
  * @property {boolean} [opaque]
  * @property {number} [tilePixelRatio]
@@ -40,6 +41,7 @@ class TileSource extends Source {
 
     super({
       attributions: options.attributions,
+      attributionsCollapsible: options.attributionsCollapsible,
       projection: options.projection,
       state: options.state,
       wrapX: options.wrapX

src/ol/source/TileImage.js

@@ -17,6 +17,7 @@ import {getForProjection as getTileGridForProjection} from '../tilegrid.js';
 /**
  * @typedef {Object} Options
  * @property {import("./Source.js").AttributionLike} [attributions] Attributions.
+ * @property {boolean} [attributionsCollapsible=true] Attributions are collapsible.
  * @property {number} [cacheSize=2048] Cache size.
  * @property {null|string} [crossOrigin] The `crossOrigin` attribute for loaded images.  Note that
  * you must provide a `crossOrigin` value if you are using the WebGL renderer or if you want to
@@ -81,7 +82,8 @@ class TileImage extends UrlTile {
       url: options.url,
       urls: options.urls,
       wrapX: options.wrapX,
-      transition: options.transition
+      transition: options.transition,
+      attributionsCollapsible: options.attributionsCollapsible
     });
 
     /**

src/ol/source/UrlTile.js

@@ -11,6 +11,7 @@ import {getKeyZXY} from '../tilecoord.js';
 /**
  * @typedef {Object} Options
  * @property {import("./Source.js").AttributionLike} [attributions]
+ * @property {boolean} [attributionsCollapsible=true] Attributions are collapsible.
  * @property {number} [cacheSize]
  * @property {boolean} [opaque]
  * @property {import("../proj.js").ProjectionLike} [projection]
@@ -47,7 +48,8 @@ class UrlTile extends TileSource {
       tileGrid: options.tileGrid,
       tilePixelRatio: options.tilePixelRatio,
       wrapX: options.wrapX,
-      transition: options.transition
+      transition: options.transition,
+      attributionsCollapsible: options.attributionsCollapsible
     });
 
     /**

src/ol/source/XYZ.js

@@ -8,6 +8,7 @@ import {createXYZ, extentFromProjection} from '../tilegrid.js';
 /**
  * @typedef {Object} Options
  * @property {import("./Source.js").AttributionLike} [attributions] Attributions.
+ * @property {boolean} [attributionsCollapsible=true] Attributions are collapsible.
  * @property {number} [cacheSize=2048] Cache size.
  * @property {null|string} [crossOrigin] The `crossOrigin` attribute for loaded images.  Note that
  * you must provide a `crossOrigin` value if you are using the WebGL renderer or if you want to
@@ -93,7 +94,8 @@ class XYZ extends TileImage {
       url: options.url,
       urls: options.urls,
       wrapX: options.wrapX !== undefined ? options.wrapX : true,
-      transition: options.transition
+      transition: options.transition,
+      attributionsCollapsible: options.attributionsCollapsible
     });
 
   }

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

@@ -9,6 +9,18 @@ import {createXYZ} from '../../../../src/ol/tilegrid.js';
 describe('ol.control.Attribution', function() {
 
   let map;
+
+  const tileLoadFunction = function() {
+    const tile = new Tile([0, 0, -1], 2 /* LOADED */);
+    tile.getImage = function() {
+      const image = new Image();
+      image.width = 256;
+      image.height = 256;
+      return image;
+    };
+    return tile;
+  };
+
   beforeEach(function() {
     const target = document.createElement('div');
     target.style.width = target.style.height = '100px';
@@ -49,16 +61,7 @@ describe('ol.control.Attribution', function() {
     });
     map.getLayers().forEach(function(layer) {
       const source = layer.getSource();
-      source.getTile = function() {
+      source.getTile = tileLoadFunction;
-        const tile = new Tile([0, 0, -1], 2 /* LOADED */);
-        tile.getImage = function() {
-          const image = new Image();
-          image.width = 256;
-          image.height = 256;
-          return image;
-        };
-        return tile;
-      };
     });
   });
 
@@ -73,4 +76,42 @@ describe('ol.control.Attribution', function() {
     expect(attribution.length).to.be(2);
   });
 
+  it('renders attributions as non-collapsible if source is configured with attributionsCollapsible set to false', function() {
+    map.getControls().clear();
+    map.addControl(new Attribution());
+    const source = new TileSource({
+      projection: 'EPSG:3857',
+      tileGrid: createXYZ(),
+      attributions: 'foo',
+      attributionsCollapsible: false
+    });
+    source.getTile = tileLoadFunction;
+    map.addLayer(new TileLayer({
+      source: source
+    }));
+    map.renderSync();
+
+    const attribution = map.getTarget().querySelectorAll('.ol-attribution.ol-uncollapsible');
+    expect(attribution.length).to.be(1);
+  });
+
+  it('renders attributions as collapsible if configured with collapsible set to true', function() {
+    map.getControls().clear();
+    map.addControl(new Attribution({collapsible: true}));
+    const source = new TileSource({
+      projection: 'EPSG:3857',
+      tileGrid: createXYZ(),
+      attributions: 'foo',
+      attributionsCollapsible: false
+    });
+    source.getTile = tileLoadFunction;
+    map.addLayer(new TileLayer({
+      source: source
+    }));
+    map.renderSync();
+
+    const attribution = map.getTarget().querySelectorAll('.ol-attribution.ol-uncollapsible');
+    expect(attribution.length).to.be(0);
+  });
+
 });