I get this error: Textfield is not a constructor-CodePudding

I know that there are a lot of question in Stackoverflow about this error, but after read some of them ( -12 questions) I don't get nothing.

My context is that I'm trying to build a npm package (my first package); in this Package there are some class that help to write Cypress more easily.

This is one the clases I want to load throught a npm package:

// node_modules/prueba-para-oskar/src/Helpers/Fields/TextField.js
class TextField {
  /**
   *
   * @param {string} value
   * @param {string} selector
   * @param {object} options
   */
  type(value, selector, options) {
    this[options.widget](value,selector);
  }

  /**
   *
   * @param {string} value
   * @param {string} selector
   */
  ckeditor(value, selector){
    cy.ckeditor(value, selector)
  }

  noCkeditor(value, selector){
    cy.get(selector).type(value);
  }
}

module.exports = TextField;

This is my package index.js

// node_modules/prueba-para-oskar/src/index.js

const TextField = require('./Helpers/Fields/TextField');


module.exports = {
    TextField
}

And this is my cypress page object

// cypress/e2e/pages/ArticlePage.js

// If I load the file as class that are in the same folder than Cypress
// (not mpn package) they works without problems.
import { Property } from "../../support/Helpers/lib/Property";
import { Submit } from "../../support/Helpers/lib/Submit";
import { FileField } from "../../support/Helpers/Fields/FileField";
import { TextAreaField } from "../../support/Helpers/Fields/TextAreaField";
// import { TextField } from "../../support/Helpers/Fields/TextField";

import { TextField } from "prueba-para-oskar";

export default class ArticlePage {
  article_path = "/node/add/article";
  tagInput = 'input[data-drupal-selector="edit-field-tags-target-id"]';
  submitButton = 'input[data-drupal-selector="edit-submit"]';

  constructor() {
    this.Property = new Property();
    this.FileField = new FileField();
    this.TextAreaField = new TextAreaField();
    this.TextField = new TextField();
    this.Submit = new Submit();
  }

  userCanAccesArticlePage() {
    cy.visit(this.article_path, { failOnStatusCode: true });
  }

  havePermissionsToSeeNodeAddArticle() {
    cy.location("pathname").should("eq", this.article_path);
  }

  clickSubmitButttom() {
    cy.get(this.submitButton).click();
  }
}

The error appears when I try to load TextField inside ArticlePage.js

Any idea how to load the class from the npm pagacke to the ObjecPage class?

Thanks.

CodePudding user response：

Please refer to the answer for this question

module.exports vs. export default in Node.js and ES6

Hope it helps :)

CodePudding user response：

In an npm package, generally the index,js is at the root of the package not in /src.

Try this way

// node_modules/prueba-para-oskar/index.js

const TextField = require('./src/Helpers/Fields/TextField');


module.exports = {
    TextField
}

Also (alternativiely) try adding a main entry to package.json

For example look at node_modules/core-util-is/package.json

{
  "name": "core-util-is",
  "version": "1.0.2",
  "description": "The `util.is*` functions introduced in Node v0.12.",
  "main": "lib/util.js",
  "repository": {
  ...

so your package.json

{
  "name": "prueba-para-oskar",
  "version": "1.0.0",
  "main": "src/index.js",
  "scripts": {
    ...