Meteor 0.6.4.1 changes confuses coffeescript? - coffeescript

After upgrading from Meteor 0.5.4 to Meteor 0.6.4.1 I modified my coffeescript code accordingly to reflect changes of the variable scope. For some reason I think the changes confused the coffeescript to javascript interpretation?
Current code:
#liveObjects = {}
test = () ->
if liveObjects.intervalID?
donothing;
liveObjects = {} --Maybe this is what caused the confusion? Mistaken as a local variable declaration?
From the Chrome tool I noticed that the javascript code as
(function() { var test;
this.liveObjects = {};
test = function() {
var liveObjects;
if (liveObjects.intervalID != null) { --ReferenceError: liveObjects is not defined
donothing;
}
liveOjects = {};

You have to set it using this/# again.
#liveObjects = {}
test = () ->
if liveObjects.intervalID?
donothing;
#liveObjects = {}

Related

Protractor test not recognizing global variable defined in onPrepare method within protractor.conf.js

I have defined a global variable within my protractor.conf.js file like this:
onPrepare() {
global.EC = protractor.ExpectedConditions;
}
I am attempting to access this variable within my protractor test like this:
navigateTo(url: string): LoginPage {
browser.get(url);
browser.wait(EC.urlIs(url), 2000);
return this;
}
However, my spec is not recognizing EC. The output log as well as the VS Code intellisense says
Cannot find name EC.
I haven't checked if there are differences in the way globals are exposed through protractor's config, but the way I use it and it works well in our test suite is like this
onPrepare: () => {
EC = protractor.ExpectedConditions;
DEFAULT_TIMEOUT = browser.params['timeout'];
if (!DEFAULT_TIMEOUT) {
DEFAULT_TIMEOUT = 60000;
}
chai = require('chai');
chaiAsPromised = require('chai-as-promised');
chai.use(chaiAsPromised);
expect = chai.expect;
...
}
So I don't use the "global" but expose directly and use it like this for example:
openCreateDialog() {
let createButton = $('.create-new');
browser.wait(EC.elementToBeClickable(createButton), DEFAULT_TIMEOUT);
createButton.click();
let dialog = new NewDialog();
dialog.waitUntilOpened();
return dialog.getCreatePanel();
}

Cannot call method 'id' of undefined

My world.js looks like this:
var protractor = require('protractor');
var webdriver = require('selenium-webdriver');
var driver = new webdriver.Builder().usingServer('xxxxx').
withCapabilities(webdriver.Capabilities.firefox()).build();
driver.manage().timeouts().setScriptTimeout(100000);
module.exports.World = function World(callback) {
this.browser = protractor.wrapDriver(driver);
this.by = protractor.by;
callback();
};
then in steps.js:
{
element(by.id('username')).sendKeys("admin");
}
When I ran it using cucumber.js, the error is:
TypeError: Cannot call method 'id' of undefined
but if I remove world.js and run it using protractor, it works.
How can I fix this?
It looks like you're not exporting by globally. I'm not sure why you're able to use the element function at all - but in any case, you should probably be doing something like:
module.exports.World = function World(callback) {
global.browser = protractor.wrapDriver(driver);
global.by = protractor.by;
};

"this" in a prototype method does not always refer to the prototype of the object itself?

Most of the times all I have to do with JavaScript is just add some dynamics to simple HTML. Recently, however, after discovering CoffeeScript, I got interested in *Object Oriented JavaScript". Here is some code in CoffeeScript.
class MyClass
constructor: (title, purpose)->
#title = typeof title is undefined ? "My Class" : title
#purpose = typeof purpose is undefined ? "None" : purpose
#myMethod()
myMethod: ->
_getTitle = #getTitle
_getPurpose = #getPurpose
$(window).click ->
_getTitle()
_getPurpose()
return
return
getTitle: ->
_title = #title
window.console.log "Title of the class this object belongs to is: #{_title}"
return
getPurpose: ->
_purpose = #purpose
window.console.log "Purpose of creating this class is: #{_purpose}"
return
title = ""
purpose = ""
myObject = new MyClass("Testbed", "to test Object Oriented JavaScript")
For those who prefer JavaScript, here is the compiled (?) JavaScript.
var MyClass, myObject;
MyClass = (function() {
var purpose, title;
function MyClass(title, purpose) {
var _ref, _ref1;
this.title = (_ref = typeof title === void 0) != null ? _ref : {
"My Class": title
};
this.purpose = (_ref1 = typeof purpose === void 0) != null ? _ref1 : {
"None": purpose
};
this.myMethod();
}
MyClass.prototype.myMethod = function() {
var _getPurpose, _getTitle;
_getTitle = this.getTitle;
_getPurpose = this.getPurpose;
$(window).click(function() {
_getTitle();
_getPurpose();
});
};
MyClass.prototype.getTitle = function() {
var _title;
_title = this.title;
window.console.log("Title of the class this object belongs to is: " + _title);
};
MyClass.prototype.getPurpose = function() {
var _purpose;
_purpose = this.purpose;
window.console.log("Purpose of creating this class is: " + _purpose);
};
title = "";
purpose = "";
return MyClass;
})();
myObject = new MyClass("Testbed", "to test Object Oriented JavaScript");
Sorry about the long code. I had to try to keep it interesting. The thing is, this code outputs:
Title of the class this object belongs to is: undefined
Purpose of creating this class is: undefined
whereas I was expecting it to output:
Title of the class this object belongs to is: Testbed
Purpose of creating this class is: to test Object Oriented JavaScript
And I could've sworn this was how it worked when I last tinkered with it (around six months ago). I learnt that in a method that is part of the prototype of an object, this refers to the prototype itself. And this.something would actually point to object.something. Whereas in this example, inside myObject.myMethod(), this behaves as it should and this.getTitle() refers to myObject.getTitle(). Inside myObject.getTitle(), however, this refers to window. Why?
Is it because getTitle() was called inside a $(window).click() handler? But why would that change the context? getTitle() is still a property of myObject.
Also, you see what I am trying to accomplish here. How could I accomplish that?
There are several problems.
1) You never return anything from .getPurpose or .getTitle
2) You should create a reference to this in myMethod. i.e. var me = this and then inside the event listener call me.getTitle() and me.getPurpose(). This is needed because inside the event listener (window onclick), this refers to the window and not the object.
3) It looks like your ternary expressions are always evaluating to false. You need to rethink them.
P.S. I looked at the straight JS version

Typescript requirejs web essentials 2.9

I just update Web essentials and Typescript to new version.
Result that my project don't work anymore.
Here's my typescript code:
/// <reference path="DefinitelyTyped/jqueryui.d.ts" />
/// <reference path="DefinitelyTyped/jquery-datatable.d.ts" />
import Common = module("Common");
import GMap = module("GMap");
declare var $: JQueryStatic;
export class Polygon extends GMap.Polygon {
Before update my generated code (that worked) was:
var __extends = this.__extends || function (d, b) {
function __() { this.constructor = d; }
__.prototype = b.prototype;
d.prototype = new __();
};
define(["require", "exports", "GMap", "Common"], function(require, exports, __GMap__, __Common__) {
var GMap = __GMap__;
var Common = __Common__;
var Polygon = (function (_super) {
__extends(Polygon, _super);
function Polygon() {
_super.apply(this, arguments);
}
Now it look-like:
var __extends = this.__extends || function (d, b) {
for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p];
function __() { this.constructor = d; }
__.prototype = b.prototype;
d.prototype = new __();
};
var Common = require("./Common");
var GMap = require("./GMap");
var Polygon = (function (_super) {
__extends(Polygon, _super);
In my console I have this error:
Uncaught Error: Module name "Common" has not been loaded yet for context: _. Use require([])
I try to add Common in the config. But before update It s just working fine.
Anyone can help me, maybe something need to be change in my code to have back my project working.
Thanks,
Jérôme
UPDATE
I just see that is due to Web Essentials 2.9, I don't have anymore the option to specify compiler option for amd module.
I just remove the extension and install back the version 2.7:
http://vswebessentials.com/nightly/webessentials2012-2.7.vsix
I would just add to this that Web Essentials does indeed support AMD modules in version 2.8 but that the option has gone missing in 2.9 - check out the comments on the download page.
You'll find the setting (in 2.8 or below) in...
Tools > Options > Web Essentials > TypeScript > "Use the AMD module"
You need to compile with the amd option. i.e.
tsc yourfile.ts --module "amd"
It defaults to "commonjs" which is the output that you are seeing at the moment.

Calling class function within a constructor isn't being recognised

Answer:
It turns out I had neglected to use the new keyword when creating the class instance. The code in the question itself is fine.
Question:
I have a fairly simple class where the constructor calls another method on the class (editor_for_node). The call happens inside a jQuery each() loop, but I've also tried moving it outside.
define ['jquery'], ($) ->
class Editor
constructor: (#node, #data, #template) ->
#node.widgets().each (i, elem) =>
data = if #data then #data[i] else null
node = $(elem)
#editor_for_node node, data
editor_for_node: (node, data) ->
console.log 'hello!'
return {
'Editor': Editor,
}
When the line #editor_for_node node, data gets called, I get an error (in Firebug) saying this.editor_for_node is not a function.
I really can't see why this isn't working properly, the only possible source of weirdness that I can see is my use of require.js's define function at the start.
Edit: Generated output
(function() {
define(['jquery'], function($) {
var Editor;
Editor = (function() {
Editor.name = 'Editor';
function Editor(node, data, template) {
var _this = this;
this.node = node;
this.data = data;
this.template = template;
this.node.widgets().each(function(i, elem) {
data = _this.data ? _this.data[i] : null;
node = $(elem);
return _this.editor_for_node(node, data);
});
}
Editor.prototype.editor_for_node = function(node, data) {
return console.log('hello!');
};
return Editor;
})();
return {
'Editor': Editor
};
});
}).call(this);
First: Which version of CoffeeScript are you using? The fat arrow has been a source of bugs in certain previous releases.
If you're using the latest (1.3.1), then I'm going to go ahead and say that this is an indentation issue. When I copy and paste your code, it works fine. Are you mixing tabs and spaces? Verify that the compiled output contains the line
Editor.prototype.editor_for_node = ...
Update: See the comments on this answer. Turns out the problem was that the new keyword wasn't being used when invoking the constructor.