[Flow] Enable type-first mode (mapbox#11605)

* add remaining missing types and enable type-first mode

* fix remaining errors

* actually enable typefirst

.flowconfig

@@ -51,7 +51,6 @@
 
 [options]
 server.max_workers=4
-types_first=false
 merge_timeout=180
 
 [strict]

bench/lib/create_map.js

@@ -29,7 +29,7 @@ export default function (options: any): Promise<Map> {
             .on(options.idle ? 'idle' : 'load', () => {
                 if (options.stubRender) {
                     // Stub out `_rerender`; benchmarks need to be the only trigger of `_render` from here on out.
-                    map._rerender = () => {};
+                    (map: any).triggerRepaint = () => {};
 
                     // If there's a pending rerender, cancel it.
                     if (map._frame) {

src/data/bucket.js

@@ -37,7 +37,7 @@ export type PopulateParameters = {
 
 export type IndexedFeature = {
     feature: VectorTileFeature,
-    id: number | string,
+    id: number | string | void,
     index: number,
     sourceLayerIndex: number,
 }

src/data/bucket/fill_extrusion_attributes.js

@@ -11,7 +11,7 @@ export const centroidAttributes: StructArrayLayout = createLayout([
     {name: 'a_centroid_pos',  components: 2, type: 'Uint16'}
 ]);
 
-export const fillExtrusionAttributesExt = createLayout([
+export const fillExtrusionAttributesExt: StructArrayLayout = createLayout([
     {name: 'a_pos_3', components: 3, type: 'Int16'},
     {name: 'a_pos_normal_3', components: 3, type: 'Int16'}
 ]);

src/geo/mercator_coordinate.js

@@ -11,7 +11,7 @@ const earthCircumference = 2 * Math.PI * earthRadius; // meters
 /*
  * The circumference at a line of latitude in meters.
  */
-export function circumferenceAtLatitude(latitude: number) {
+export function circumferenceAtLatitude(latitude: number): number {
     return earthCircumference * Math.cos(latitude * Math.PI / 180);
 }
 

src/geo/projection/globe_util.js

@@ -242,7 +242,7 @@ export function aabbForTileOnGlobe(tr: Transform, numTiles: number, tileId: Cano
     return new Aabb(cornerMin, cornerMax);
 }
 
-export function globeTileLatLngCorners(id: CanonicalTileID) {
+export function globeTileLatLngCorners(id: CanonicalTileID): [[number, number], [number, number]] {
     const tileScale = 1 << id.z;
     const left = id.x / tileScale;
     const right = (id.x + 1) / tileScale;
@@ -395,7 +395,7 @@ export function globePoleMatrixForTile(z: number, x: number, tr: Transform): Flo
     return Float32Array.from(poleMatrix);
 }
 
-export function getGridMatrix(id: CanonicalTileID, corners: Array<Array<number>>): Array<number> {
+export function getGridMatrix(id: CanonicalTileID, corners: [[number, number], [number, number]]): Array<number> {
     const [tl, br] = corners;
     const S = 1.0 / GLOBE_VERTEX_GRID_SIZE;
     const x = (br[1] - tl[1]) * S;

src/render/draw_sky.js

@@ -111,7 +111,7 @@ function drawSkyboxFromCapture(painter: Painter, layer: SkyLayer, depthMode: Dep
         layer.skyboxGeometry.indexBuffer, layer.skyboxGeometry.segment);
 }
 
-function drawSkyboxFace(context: Context, layer: SkyLayer, program: Program<*>, faceRotate: Mat4, sunDirection: [number, number, number], i: number) {
+function drawSkyboxFace(context: Context, layer: SkyLayer, program: Program<any>, faceRotate: Mat4, sunDirection: [number, number, number], i: number) {
     const gl = context.gl;
 
     const atmosphereColor = layer.paint.get('sky-atmosphere-color');

src/style-spec/expression/definitions/comparison.js

@@ -5,7 +5,7 @@ import Assertion from './assertion.js';
 import {typeOf} from '../values.js';
 import RuntimeError from '../runtime_error.js';
 
-import type {Expression, SerializedExpression} from '../expression.js';
+import type {Expression, SerializedExpression, ExpressionRegistration} from '../expression.js';
 import type EvaluationContext from '../evaluation_context.js';
 import type ParsingContext from '../parsing_context.js';
 import type {Type} from '../types.js';
@@ -59,7 +59,7 @@ function gteqCollate(ctx: EvaluationContext, a: any, b: any, c: any): boolean {
  *
  * @private
  */
-function makeComparison(op: ComparisonOperator, compareBasic: (EvaluationContext, any, any) => boolean, compareWithCollator: (EvaluationContext, any, any, any) => boolean) {
+function makeComparison(op: ComparisonOperator, compareBasic: (EvaluationContext, any, any) => boolean, compareWithCollator: (EvaluationContext, any, any, any) => boolean): ExpressionRegistration {
     const isOrderComparison = op !== '==' && op !== '!=';
 
     return class Comparison implements Expression {

src/style-spec/expression/definitions/within.js

@@ -192,6 +192,7 @@ function getTilePoints(geometry, pointBBox, polyBBox, canonical: CanonicalTileID
     const worldSize = Math.pow(2, canonical.z) * EXTENT;
     const shifts = [canonical.x * EXTENT, canonical.y * EXTENT];
     const tilePoints = [];
+    if (!geometry) return tilePoints;
     for (const points of geometry) {
         for (const point of points) {
             const p = [point.x + shifts[0], point.y + shifts[1]];
@@ -206,6 +207,7 @@ function getTileLines(geometry, lineBBox, polyBBox, canonical: CanonicalTileID)
     const worldSize = Math.pow(2, canonical.z) * EXTENT;
     const shifts = [canonical.x * EXTENT, canonical.y * EXTENT];
     const tileLines = [];
+    if (!geometry) return tileLines;
     for (const line of geometry) {
         const tileLine = [];
         for (const point of line) {

src/style-spec/expression/evaluation_context.js

@@ -42,7 +42,7 @@ class EvaluationContext {
         return this.feature ? typeof this.feature.type === 'number' ? geometryTypes[this.feature.type] : this.feature.type : null;
     }
 
-    geometry() {
+    geometry(): ?Array<Array<Point>> {
         return this.feature && 'geometry' in this.feature ? this.feature.geometry : null;
     }
 

src/style-spec/function/convert.js

@@ -1,15 +1,15 @@
 // @flow
 
 import assert from 'assert';
-import type {StylePropertySpecification} from '../style-spec.js';
 
-export default convertFunction;
+import type {StylePropertySpecification} from '../style-spec.js';
+import type {ExpressionSpecification} from '../types.js';
 
 function convertLiteral(value) {
     return typeof value === 'object' ? ['literal', value] : value;
 }
 
-function convertFunction(parameters: any, propertySpec: StylePropertySpecification) {
+export default function convertFunction(parameters: any, propertySpec: StylePropertySpecification): ExpressionSpecification {
     let stops = parameters.stops;
     if (!stops) {
         // identity function
@@ -244,7 +244,7 @@ function getFunctionType(parameters, propertySpec) {
 }
 
 // "String with {name} token" => ["concat", "String with ", ["get", "name"], " token"]
-export function convertTokenString(s: string) {
+export function convertTokenString(s: string): string | ExpressionSpecification {
     const result = ['concat'];
     const re = /{([^{}]+)}/g;
     let pos = 0;

src/style-spec/migrate/expressions.js

@@ -15,7 +15,7 @@ import type {StyleSpecification} from '../types.js';
  * this will convert (a) "stop" functions, and (b) legacy filters to their
  * expression equivalents.
  */
-export default function(style: StyleSpecification) {
+export default function(style: StyleSpecification): StyleSpecification {
     const converted = [];
 
     eachLayer(style, (layer) => {

src/style-spec/validate/validate.js

@@ -26,6 +26,7 @@ import validateProjection from './validate_projection.js';
 
 import type {StyleReference} from '../reference/latest.js';
 import type {StyleSpecification} from '../types.js';
+import type ValidationError from '../error/validation_error.js';
 
 const VALIDATORS = {
     '*'() {
@@ -67,7 +68,7 @@ export type ValidationOptions = {
     styleSpec: StyleReference;
 }
 
-export default function validate(options: ValidationOptions) {
+export default function validate(options: ValidationOptions): Array<ValidationError> {
     const value = options.value;
     const valueSpec = options.valueSpec;
     const styleSpec = options.styleSpec;

src/style/query_utils.js

@@ -24,7 +24,7 @@ export function translate(queryGeometry: Array<Point>,
                    translate: [number, number],
                    translateAnchor: 'viewport' | 'map',
                    bearing: number,
-                   pixelsToTileUnits: number) {
+                   pixelsToTileUnits: number): Array<Point> {
     if (!translate[0] && !translate[1]) {
         return queryGeometry;
     }

src/style/style_layer/circle_style_layer.js

@@ -33,7 +33,7 @@ class CircleStyleLayer extends StyleLayer {
         super(layer, properties);
     }
 
-    createBucket(parameters: BucketParameters<*>) {
+    createBucket(parameters: BucketParameters<*>): CircleBucket<CircleStyleLayer> {
         return new CircleBucket(parameters);
     }
 
@@ -66,7 +66,7 @@ class CircleStyleLayer extends StyleLayer {
             this.paint.get('circle-pitch-scale') === 'map', translation, size);
     }
 
-    getProgramIds() {
+    getProgramIds(): Array<string> {
         return ['circle'];
     }
 

src/style/style_layer/fill_extrusion_style_layer.js

@@ -28,7 +28,7 @@ class FillExtrusionStyleLayer extends StyleLayer {
         super(layer, properties);
     }
 
-    createBucket(parameters: BucketParameters<FillExtrusionStyleLayer>) {
+    createBucket(parameters: BucketParameters<FillExtrusionStyleLayer>): FillExtrusionBucket {
         return new FillExtrusionBucket(parameters);
     }
 

src/style/style_layer/hillshade_style_layer.js

@@ -7,7 +7,6 @@ import {Transitionable, Transitioning, PossiblyEvaluated} from '../properties.js
 
 import type {PaintProps} from './hillshade_style_layer_properties.js';
 import type {LayerSpecification} from '../../style-spec/types.js';
-import ProgramConfiguration from '../../data/program_configuration.js';
 
 class HillshadeStyleLayer extends StyleLayer {
     _transitionablePaint: Transitionable<PaintProps>;
@@ -25,10 +24,6 @@ class HillshadeStyleLayer extends StyleLayer {
     getProgramIds(): Array<string> {
         return ['hillshade', 'hillshadePrepare'];
     }
-
-    getProgramConfiguration(zoom: number): ProgramConfiguration {
-        return new ProgramConfiguration(this, zoom);
-    }
 }
 
 export default HillshadeStyleLayer;

src/style/style_layer/typed_style_layer.js

@@ -4,14 +4,12 @@ import type CircleStyleLayer from './circle_style_layer.js';
 import type FillStyleLayer from './fill_style_layer.js';
 import type FillExtrusionStyleLayer from './fill_extrusion_style_layer.js';
 import type HeatmapStyleLayer from './heatmap_style_layer.js';
-import type HillshadeStyleLayer from './hillshade_style_layer.js';
 import type LineStyleLayer from './line_style_layer.js';
 import type SymbolStyleLayer from './symbol_style_layer.js';
 
 export type TypedStyleLayer = CircleStyleLayer |
     FillStyleLayer |
     FillExtrusionStyleLayer |
     HeatmapStyleLayer |
-    HillshadeStyleLayer |
     LineStyleLayer |
     SymbolStyleLayer;

src/style/style_layer_index.js

@@ -1,6 +1,5 @@
 // @flow
 
-import StyleLayer from './style_layer.js';
 import createStyleLayer from './create_style_layer.js';
 
 import {values} from '../util/util.js';
@@ -13,11 +12,11 @@ export type LayerConfigs = {[_: string]: LayerSpecification };
 export type Family<Layer: TypedStyleLayer> = Array<Layer>;
 
 class StyleLayerIndex {
-    familiesBySource: { [source: string]: { [sourceLayer: string]: Array<Family<*>> } };
+    familiesBySource: { [source: string]: { [sourceLayer: string]: Array<Family<TypedStyleLayer>> } };
     keyCache: { [source: string]: string };
 
     _layerConfigs: LayerConfigs;
-    _layers: {[_: string]: StyleLayer };
+    _layers: {[_: string]: TypedStyleLayer };
 
     constructor(layerConfigs: ?Array<LayerSpecification>) {
         this.keyCache = {};
@@ -36,7 +35,7 @@ class StyleLayerIndex {
         for (const layerConfig of layerConfigs) {
             this._layerConfigs[layerConfig.id] = layerConfig;
 
-            const layer = this._layers[layerConfig.id] = createStyleLayer(layerConfig);
+            const layer = this._layers[layerConfig.id] = ((createStyleLayer(layerConfig): any): TypedStyleLayer);
             layer.compileFilter();
             if (this.keyCache[layerConfig.id])
                 delete this.keyCache[layerConfig.id];

src/terrain/elevation.js

@@ -33,9 +33,9 @@ export class Elevation {
     /**
      * Helper that checks whether DEM data is available at a given mercator coordinate.
      * @param {MercatorCoordinate} point Mercator coordinate of the point to check against.
-     * @returns {number} `true` indicating whether the data is available at `point`, and `false` otherwise.
+     * @returns {boolean} `true` indicating whether the data is available at `point`, and `false` otherwise.
      */
-    isDataAvailableAtPoint(point: MercatorCoordinate) {
+    isDataAvailableAtPoint(point: MercatorCoordinate): boolean {
         const sourceCache = this._source();
         if (!sourceCache || point.y < 0.0 || point.y > 1.0) {
             return false;
@@ -50,7 +50,7 @@ export class Elevation {
         const y = Math.floor(point.y * tiles);
         const demTile = this.findDEMTileFor(new OverscaledTileID(z, wrap, z, x, y));
 
-        return demTile && demTile.dem;
+        return !!(demTile && demTile.dem);
     }
 
     /**

src/ui/camera.js

@@ -108,6 +108,8 @@ export type AnimationOptions = {
     essential?: boolean
 };
 
+export type EasingOptions = CameraOptions & AnimationOptions;
+
 export type ElevationBoxRaycast = {
     minLngLat: LngLat,
     maxLngLat: LngLat,
@@ -561,7 +563,7 @@ class Camera extends Evented {
      *     padding: {top: 10, bottom:25, left: 15, right: 5}
      * });
      */
-    cameraForBounds(bounds: LngLatBoundsLike, options?: CameraOptions): void | CameraOptions & AnimationOptions {
+    cameraForBounds(bounds: LngLatBoundsLike, options?: CameraOptions): ?EasingOptions {
         bounds = LngLatBounds.convert(bounds);
         const bearing = (options && options.bearing) || 0;
         return this._cameraForBoxAndBearing(bounds.getNorthWest(), bounds.getSouthEast(), bearing, options);
@@ -616,7 +618,7 @@ class Camera extends Evented {
      *   padding: {top: 10, bottom:25, left: 15, right: 5}
      * });
      */
-    _cameraForBoxAndBearing(p0: LngLatLike, p1: LngLatLike, bearing: number, options?: CameraOptions): void | CameraOptions & AnimationOptions {
+    _cameraForBoxAndBearing(p0: LngLatLike, p1: LngLatLike, bearing: number, options?: CameraOptions): ?EasingOptions {
         const eOptions = this._extendCameraOptions(options);
         const tr = this.transform;
         const edgePadding = tr.padding;
@@ -693,7 +695,7 @@ class Camera extends Evented {
      *      `center`, `zoom`, `bearing` and `pitch`. If map is unable to fit, method will warn and return undefined.
      * @private
      */
-    _cameraForBox(p0: LngLatLike, p1: LngLatLike, minAltitude?: number, maxAltitude?: number, options?: CameraOptions): void | CameraOptions & AnimationOptions {
+    _cameraForBox(p0: LngLatLike, p1: LngLatLike, minAltitude?: number, maxAltitude?: number, options?: CameraOptions): ?EasingOptions {
         const eOptions = this._extendCameraOptions(options);
 
         minAltitude = minAltitude || 0;
@@ -804,7 +806,7 @@ class Camera extends Evented {
      * });
      * @see [Example: Fit a map to a bounding box](https://www.mapbox.com/mapbox-gl-js/example/fitbounds/)
      */
-    fitBounds(bounds: LngLatBoundsLike, options?: AnimationOptions & CameraOptions, eventData?: Object): this {
+    fitBounds(bounds: LngLatBoundsLike, options?: EasingOptions, eventData?: Object): this {
         return this._fitInternal(
             this.cameraForBounds(bounds, options),
             options,
@@ -877,7 +879,7 @@ class Camera extends Evented {
      * });
      * @see Used by {@link BoxZoomHandler}
      */
-    fitScreenCoordinates(p0: PointLike, p1: PointLike, bearing: number, options?: AnimationOptions & CameraOptions, eventData?: Object): this {
+    fitScreenCoordinates(p0: PointLike, p1: PointLike, bearing: number, options?: EasingOptions, eventData?: Object): this {
         let lngLat0, lngLat1, minAltitude, maxAltitude;
         const point0 = Point.convert(p0);
         const point1 = Point.convert(p1);
@@ -919,7 +921,7 @@ class Camera extends Evented {
             options, eventData);
     }
 
-    _fitInternal(calculatedOptions?: CameraOptions & AnimationOptions, options?: AnimationOptions & CameraOptions, eventData?: Object): this {
+    _fitInternal(calculatedOptions?: ?EasingOptions, options?: EasingOptions, eventData?: Object): this {
         // cameraForBounds warns + returns undefined if unable to fit:
         if (!calculatedOptions) return this;
 
@@ -1139,7 +1141,7 @@ class Camera extends Evented {
      * unless `options` includes `essential: true`.
      *
      * @memberof Map#
-     * @param {CameraOptions & AnimationOptions} options Options describing the destination and animation of the transition.
+     * @param {EasingOptions} options Options describing the destination and animation of the transition.
      *            Accepts {@link CameraOptions} and {@link AnimationOptions}.
      * @param {Object | null} eventData Additional properties to be added to event objects of events triggered by this method.
      * @fires Map.event:movestart
@@ -1170,7 +1172,7 @@ class Camera extends Evented {
      * });
      * @see [Example: Navigate the map with game-like controls](https://www.mapbox.com/mapbox-gl-js/example/game-controls/)
      */
-    easeTo(options: CameraOptions & AnimationOptions & {easeId?: string, preloadOnly?: boolean}, eventData?: Object): this {
+    easeTo(options: EasingOptions & {easeId?: string, preloadOnly?: boolean}, eventData?: Object): this {
         this._stop(false, options.easeId);
 
         options = extend({
@@ -1421,7 +1423,7 @@ class Camera extends Evented {
      * @see [Example: Slowly fly to a location](https://www.mapbox.com/mapbox-gl-js/example/flyto-options/)
      * @see [Example: Fly to a location based on scroll position](https://www.mapbox.com/mapbox-gl-js/example/scroll-fly-to/)
      */
-    flyTo(options: CameraOptions & AnimationOptions & {preloadOnly?: boolean}, eventData?: Object): this {
+    flyTo(options: EasingOptions & {preloadOnly?: boolean}, eventData?: Object): this {
         // Fall through to jumpTo if user has set prefers-reduced-motion
         if (!options.essential && browser.prefersReducedMotion) {
             const coercedOptions = pick(options, ['center', 'zoom', 'bearing', 'pitch', 'around']);

src/ui/control/navigation_control.js

@@ -199,10 +199,12 @@ class MouseRotateWrapper {
     move(e: MouseEvent, point: Point) {
         const map = this.map;
         const r = this.mouseRotate.mousemoveWindow(e, point);
-        if (r && r.bearingDelta) map.setBearing(map.getBearing() + r.bearingDelta);
+        const delta = r && r.bearingDelta;
+        if (delta) map.setBearing(map.getBearing() + delta);
         if (this.mousePitch) {
             const p = this.mousePitch.mousemoveWindow(e, point);
-            if (p && p.pitchDelta) map.setPitch(map.getPitch() + p.pitchDelta);
+            const delta = p && p.pitchDelta;
+            if (delta) map.setPitch(map.getPitch() + delta);
         }
     }