Coffeescript：无法在其他文件中实例化类的对象

Question

I'm unable to instantiate (or call their methods) classes present in other files in my protractor codes in testing. Here are my files

Input.coffee

   class exports.Input

      @element = null

        constructor: (@type, @selector, @identifier) ->
        if @selector is "id"
          @element = element(By.id(@identifier))
        if @selector is "class"
          @element = element(By.css(@identifier))
        console.log @element

      click: ->
        @element.click()

      putText: (inputText) ->
        @element.sendKeys(inputText)  

test.coffee

describe 'Testing protractor modules', ->
  it 'Testing demo and experimentations', ->
# Initialize all the DOM elements which the suite covers 
    initialize = require('..\\utils\\initialize.coffee').Initialize("https://url.com")    

    inputText = require('..\\utils\\input.coffee').Input("text", "id", "user_email")
    inputPassword = require('..\\utils\\input.coffee').Input("text", "id", "user_password")

    console.log inputText # This is printing undefined
    inputText.putText("analytics@grs.com")
    inputPassword.putText("analytics123")

initialize.coffee

class exports.Initialize
  constructor: (@url) ->
    browser.ignoreSynchronization = true
    browser.get @url
    console.log "Initialize constructor" # This works   

Error: Cannot read property of undefined.

Answer 1

The problem here is cause the required CoffeeScript files aren't transpiled to JavaScript. If you include CoffeeScript compiler in your HTML page it'll only automatically compile <script type="text/coffeescript"> elements at the start.

I'd basically stop using require to include CoffeeScript files.

Although there's a utility that concatenates various CoffeeScript files into a single one, here https://github.com/fairfieldt/coffeescript-concat (quoted in this post , this is why this is a duplicate question), so you can easily compile the single file to JavaScript.

If you still want something similiar to require to load CoffeeScript files you'd need to make an asynchronous or synchronous HTTP request for such file, get the content, then transpile it to JS code.

Synchronous HTTP requests are deprecated, so you can't make something similiar for require , you'd need a callback function to be executed later... or too late, after the request has been done and after the CoffeeScript was compiled.

You'll also need to evaluate the compiled CoffeeScript with Function or eval . eval executes the code in the current scope it has been called, while Function executes in the global scope.

Example using asynchronous HTTP requests and eval to evaluate the compiled CoffeeScript (include the CoffeeScript compiler first):

(Note: this example doesn't avoid a script to cache, this is a bit broad)

function getCoffee(filePath, callback) {
    var request = new XMLHttpRequest;
    request.open('get', filePath, true);

    request.onreadystatechange = function() {
        if (request.readyState === 4) {

            if (request.status === 200) {
                var compiled = CoffeeScript.compile(request.responseText);

                if (typeof callback === 'function') {
                    callback(compiled);
                }
            }
            else {
                /* Handle request error here */
            }
        }
    };

    request.send();
}

getCoffee "script.coffee",
          (compiled) ->
            eval compiled;

Note: I don't know the way how your require works because I don't know Angular.js, so you may handle the exports manually.