[Need Help]I try to build the code but it shows lots of typeerror...

[laddish]

Describe the bug First of all, thank you so much for creating this awesome lib. When I using it ,and try to build packages, I met some problem, so I open this issue, hope it won't bother you.

Package Version "name": "ol-wfst", "version": "2.0.0",

To Reproduce Steps to reproduce the behavior: when I wirte code like

import {
  Fill,
  Stroke,
  Circle,
  Style
} from 'ol/style';
import Wfst from 'ol-wfst';
import Map from 'ol/Map';
import View from 'ol/View';

import {
  Tile as TileLayer,
} from 'ol/layer';

import OSM from 'ol/source/OSM';

const osmLayer= new TileLayer({
  source: new OSM()
});

const map = new Map({
  layers: [osmLayer],
  target: document.getElementById('map'),
  view: new View({
    center: [-27742148.67849364, 4013558.6683776584],
    maxZoom: 19,
    zoom: 6.528567822732854,
  }),
});

const wfst = new Wfst(map, {
  geoServerUrl: 'http://xxx.xx.xx.xx:8080/geoserver/ez/ows',
  layers: [{
      name: 'ez:LRRL',
      label: 'LRRL', 
      mode: 'wfs',
      wfsStrategy: 'bbox',
      zIndex: 99,
      style: new Style({
        image: new Circle({
          radius: 7,
          fill: new Fill({
            color: '#000000'
          }),
          stroke: new Stroke({
            color: [255, 0, 0],
            width: 2
          })
        })
      })
    }
  ],
  minZoom: 12,
  showUpload: true,
});

It shows Loading for a long long time, and the feature layer doesn't show.

I check the internet.

I saw only two "/oms" request, GetCapabilities

and DescribeFeatureType,

the response seems ok,

but why the layer didn't show.... and there is still loading?

I suppose it must will fetch 'GetFeature' to add a newWfsLayer, but i didn't see other request, So I want to see how the code or progress goes wrong... i find the code most likely in here...

          yield this._getGeoserverLayersData(this.options.layers, this.options.geoServerUrl);

          this._createLayers(this.options.layers);

  /**
   * Connect to the GeoServer and retrieve metadata about the service (GetCapabilities).
   * Get each layer specs (DescribeFeatureType) and create the layers and map controls.
   *
   * @param layers
   * @param showControl
   * @param active
   * @private
   */

  _initAsyncOperations() {
    return __awaiter(this, void 0, void 0, function* () {
      try {
        this._createBaseControl();

        this._showLoading();

        yield this._connectToGeoServerAndGetCapabilities();

        if (this.options.layers) {
          yield this._getGeoserverLayersData(this.options.layers, this.options.geoServerUrl);

          this._createLayers(this.options.layers);
        }

        this._initMapElements(this.options.showControl, this.options.active);
      } catch (err) {
        this._hideLoading();

        this._showError(err.message);
      }
    });
  }

So I want to add some 'console.log' to check where is wrong, I pull the whole code and run "yarn" or "npm i" to install all the dependences, it goes fine; But when I run the scripts from the ‘package.json’ like "yarn build" to build packages, I got lots of TypeError,

and I try to update the dependences "@types/ol" to "^6.5.3", but it still show the same errors I figure its typescript's problem, and i am a typescript beginner, i'm wondering how to fix it or skip the typescript problem but i dont know how to fix it,

So I'm wondering is there something wrong with my steps? Does the code still work fine on your project? Thanks again for your patient to read till here.

Expected behavior I expect it build successfully.

Desktop (please complete the following information):

• Browser : Google
• Version: 97.0.4692.71

Additional context Add any other context about the problem here. when i use the original openlayers

import GeoJSON from 'ol/format/GeoJSON';
import {
  bbox as bboxStrategy
} from 'ol/loadingstrategy';
const vectorSource = new VectorSource({
  format: new GeoJSON(),
  url: function (extent) {
    return (
      'http://xxx.xx.xx.xx:8080/geoserver/ez/ows?service=WFS&' +
      'version=1.1.0&request=GetFeature&typename=ez:LRRL&' +
      'outputFormat=application/json&srsname=EPSG:3857&' +
      'bbox=' +
      extent.join(',') +
      ',EPSG:3857'
    );
  },
  strategy: bboxStrategy,
});

the geoserver and wfsserver works fine.

I notice your code use the 4326 to fetch the feature, so i want to modify the code to build a new package. but when i build i met above typeerror problem.

[GastonZalba]

Hello, thanks for the detailed report. I will look at this as soon as possible.

*EDIT: i'm gonna update the lib soon and all the types errors are going to disappear. This is beacuse the newer versions of ol changed the types behavior. For example, Feature type is now invalid, you need something like Feature<Geometry> or Feature<LineString> . I will update/upload this fix tomorrow (and add sourcemaps, so it will be more easy to debug/inspect).

On top of that, i need to add more customizable options and improve error handling... (this is gonna take more time, i guess). On the other hand, I still don't know exactly why doesn't work on your project. I asssume, maybe something with the projection, but i don't understand why it doesn't throw an error...

And maybe you wanna check chrome overrides. This allows you to change the code (and insert some console.log) directly in the browser, without the need to make a new build.

[laddish]

Hello, thanks for the detailed report. I will look at this as soon as possible.

*EDIT: i'm gonna update the lib soon and all the types errors are going to disappear. This is beacuse the newer versions of ol changed the types behavior. For example, Feature type is now invalid, you need something like Feature<Geometry> or Feature<LineString> . I will update/upload this fix tomorrow (and add sourcemaps, so it will be more easy to debug/inspect).

On top of that, i need to add more customizable options and improve error handling... (this is gonna take more time, i guess). On the other hand, I still don't know exactly why doesn't work on your project. I asssume, maybe something with the projection, but i don't understand why it doesn't throw an error...

And maybe you wanna check chrome overrides. This allows you to change the code (and insert some console.log) directly in the browser, without the need to make a new build.

Thank you so much for giving me timely responses and useful advices! I will definately and immediately have a try according to your solution and look forward to it. I really appreciate it that for you leting me know your plans and efforts, there is no hurry, take your time~

[GastonZalba]

Hi, check the new version. There are some breaking changes, so you have to initialize as: var wfst = new Wfst(options); map.addControl(wfst);

The default EPSG is now 3857. But there is a new option geoServerAdvanced, that allows to change the geoserver projection, services version, etc. Try that. If nothing works and it's still hanging up maybe there is now some clue in the console? I tried to replicate your situation with no luck. It's works fine, or if i misconfigure on purpose, everytime the loading is aborted and an error is displayed...

Types are updated if you wanna build your own. Let me known how it works for you!

EDIT: Ok ok, now i found what is happening with your config. Your zoom level is to far (6), and you set the Wfst minZoom too close (12). So there is a bug happening there. You have no layer visible on init, and a false loading message appears (until you zoom in and some real loading happend). This incorrectly loading message will be fixed in next update (3.0.1). In anyway, you have to change the minZoom to something like 5 to see your layers (take in consideration if you are using wfs mode, and the minZoom is to far and you have many features, the map performance will be bad).

[laddish]

map.addControl(wfst);

Hi, check the new version. There are some breaking changes, so you have to initialize as: var wfst = new Wfst(options); map.addControl(wfst);

The default EPSG is now 3857. But there is a new option geoServerAdvanced, that allows to change the geoserver projection, services version, etc. Try that. If nothing works and it's still hanging up maybe there is now some clue in the console? I tried to replicate your situation with no luck. It's works fine, or if i misconfigure on purpose, everytime the loading is aborted and an error is displayed...

Types are updated if you wanna build your own. Let me known how it works for you!

EDIT: Ok ok, now i found what is happening with your config. Your zoom level is to far (6), and you set the Wfst minZoom too close (12). So there is a bug happening there. You have no layer visible on init, and a false loading message appears (until you zoom in and some real loading happend). This incorrectly loading message will be fixed in next update (3.0.1). In anyway, you have to change the minZoom to something like 5 to see your layers (take in consideration if you are using wfs mode, and the minZoom is to far and you have many features, the map performance will be bad).

It works!!! Thank you for updating the code! It is indeed my configuration 'minZoom' that is wrong,🤦‍♂️ I was too careless. Sorry for taking you so long and effort, I am such a dingus!😂 Now I still need time to read whole code, try to understand and straighten out the logic, 🤩I see the comments are clear and detailed. I hope that one day I can also contribute my little power~

[GastonZalba]

Good that it's works! And excelent if you wanna contribute (altought the module it's a little messy right now, that many lines in one unique file it's very complicated to explore). In the next week (i hope) i will refactor and modularize in multiples the files so it will more easy to read and collaborate. I'm closing this issue, but feel free to generate another ones with feature requests or bugs.