ContentTools tutorial: undefined element on function parameters - javascript

I am testing the wysiwyg editor ContentTools and I have to admit is fantastic. Unfortunately the tutorials are "dry" and all with coffeescript (which might be an advantage for who knows it). My problem right now is that the tutorials are not 100% bugfree (as the author said somewhere) and don't provide an archive with them working.
So right now I'm stuck with one of the basics: add a new tool to the toolbar.
The error I get is:
content-tools.js:10516 Uncaught ReferenceError: element is not defined
which points to the trivial
TimeTool.getDatetime(element, selection)(function() {
The time-tool.coffee I created is here and the tutorial is here.
One of the big drawbacks of ContentTools is that the additional tools need to be compiled in the library (at least that's what I understood), so the jsfiddle can't link to a CDN-ed version of ContentTools.
How could it be possible to get an object not defined on the parameters of a function?

I have had success with changing
#getDatetime(element, selection) ->
to
#getDatetime: (element, selection) ->
This makes it in the same syntax as the apply function - and actually works.. :O

Related

Extending TestComplete: How to change cursor?

I wrote a TestComplete extension to update Keyword-Test signature from TestComplete in to an external tool.
However, this action takes very long time. That's why I need to change the cursor from arrow to hour glass, and back to arrow after action is done.
The module doing the opperation is writen in js.
If I try to use the following code, suggested by TestComplete code completition
Win32API.SetCursor(Win32API.IDC_WAIT);
I got the error "Object expected". I.e., the js in the TestComplete extension does not know About Win32API object, despite the code completition suggestion.
Ommiting the Win32API. prefix has the same effect. Trying to create appropiate object via
new ActiveXObject("SomeKindClass")
fails, because I am not able to find appropiate name for the class containing some methode to change cursor. (I tryed, Microsoft.Win32, Microsoft.Win32API, Win32, Win32API and some other non-sence names...)
SmartBears description on writing extentions seems to contain no hint about changing the cursor in a js ScriptExtension.
Please appologize, if I overlook it.
Any suggestions are appreciated. Thanx in advice for your F1!
Edit:
A possible way to solve this is described bellow. However, I am not able to follow it to the end, because of lack of time. Perhaps someone can confirm or deny the correctness. That' would be great.
Steps:
Create a new vbs module in the ScriptExtension (or extend an existing one if any).
In
the init method of vbs module, load user32.dll, create prototypes for
the LoadCursor and CreateCursor methods of user32.dll. (See Tutorial)
You call those methods in your setCursor2* methods.
Declare the setCursor2* methods in the Description.xml as method in RuntimeObject of your namespace (See Script Extension Description file)
Call the methods in the js module YourNameSpace.setCursor2Hourglass(); and YourNameSpace.setCursor2Arrow(); respectively.
It is impossible to show an hour glass from a TestComplete extension.
The reason is, following quote, that comes from https://support.smartbear.com/testcomplete/docs/working-with/extending/script/creating/specifics.htm.
"If your design-time action performs actions against the TestComplete
main window (for example, minimizes the window, changes the window
size and position, and so on), an error will occur. This happens due
to specifics of thread organization in TestComplete."
I guess, the "on so on" part includes changing the cursor…

How to get jsdoc generation for parms of class methods that use arrow functions?

I'm a student who's capstone project/work intergrated learning is about to end. I'm working on producing technical documentation to hand off to the next team that will continue on with this work, but I've hit a snag.
My class methods that use arrow functions aren't generating params documentation when I create documentation using the jsdoc tool.
i.e.:
becomes
The documentation works as intended in visual studio code/intellisense:
I've been googling around to try and figure out what the problem was, but I failed to find anything.
I mean, my research yielded:
Outdated way to make vscode play nice with arrow function
syntax: (https://github.com/Microsoft/vscode/issues/36283) (https://github.com/Microsoft/vscode/issues/22264) ((This one is the actual issue where the support was added) https://github.com/microsoft/TypeScript/issues/14134)
Outdated info on the jsdoc support for this feature:
https://github.com/jsdoc/jsdoc/issues/1310
etc., etc., again, nothing useful.
Of note is that I'm using the jsdoc-export-default-interop plugin so that jsdoc will actually generate things for export default [CLASS OR FUNCTION].
I've found a solution that fits my requirements
However, while it is good enough for my purposes, I'm not entirely sure it's acurate and would be happy to hear critisims, other people's viewpoints and solutions. I'll explain the concerns I have at the end.
The problem: It looks like jsdoc cannot automatically detect if a member assignment is a function when parsing.
I have no idea why VSCode is able to detect it automatically, but it appears the JSDoc tool cannot. Here it is stated in the official documentation
Link to documentation: (https://jsdoc.app/tags-function.html)
The solution: Document the member with the #function tag (or an alias like #method).
By documenting the class member with the #function tag like so:
I am able to get the arrow function to generate as a class method, and get params documentation:
My concerns
Well the biggest concern/annoyance is now I need to go through all the source code and add a bunch of #function tags. Ah whelp.
Other concerns are that I may have misunderstood the problem/I'm not quite sure if this is best practice.
And I'm not too certain if this documentation is accurate in terms of if there is actually a tangible difference between a class member arrow function and a class method that I need to capture in the API documentation.
Anyway, I think this will be what I go with, but I'll be monitoring this answer to read any input/feedback :)

Minified JS only works by pasting source into Controller

I'm not sure if there is a clear way for me to show / describe the problem that I'm having. But here goes:
I've developed an app with AngularJS (have not put live yet). It was decided that we needed tooltips for some of the metrics on the tables. We liked the general look of TipTip jQuery Plugin.
On my index file I correctly include the minified.js:
<script src="../assets/javascripts/app/jquery.tipTip.minified.js"></script>
(yes, the path is correct. I can click on the link in chrome developer tools and see the source file).
In my controller, I call it with this:
$scope.addTolltips = function() {
$timeout(function(){$('.results-metrics').tipTip({maxWidth:"300px", defaultPosition: "top"});},500);
}
I added the $timeout to make sure there was enough time for dynamic stuff on the page to be load in the DOM. I know it's probably not necessary anymore though.
But when tipTip() is being called I get a console error:
TypeError: Object [object Object] has no method 'tipTip'
However, if I take the minified source and paste it into my controller before the tipTip(), then everything works perfect. Any thoughts?
angularjs provides jQuery functionality via the angular.element function (http://docs.angularjs.org/api/angular.element), so you should use it instead of $ (however, I cannot explain why $ isn't working in your case)

Is it possible to compile WebDriverJS without minimizing the code by Google Closure Compiler?

I need to modify WebDriverJS for my purposes. The compiled source is giving me a hard time debugging, though. Describing function names and comments would help me out big time! So I was wondering whether it is possible to compile WebDriverJS without minimizing it's content.
The build.desc for the JavaScript compilation is using js_binary which is using Google Closure Compiler. Anyone of you know how to compile it and preserve functionnames and comments? This would rather be a merge of all sources then a compilation.
Thanks to Chads Post in "Potential differences between compiled and uncompiled Javascript" I've taken a deeper look at the flags of closure compiler.
--compilation_level=WHITESPACE_ONLY preserves function and variable names
--formatting=PRETTY_PRINT doesn't remove linebreaks
--formatting=PRINT_INPUT_DELIMETER gives me a better overview in which file to search for the source
Unfortunately I still couldn't figure out how to save the comments, but thats just a small problem since I can look them up in the source code.
Update:
Seems like the compilation_level doesn't remove the goog.required-calls. I've got to remove them somehow, because the script doesn't work with them.
Update 2:
I've removed all goog.require($mod) and goog.provide($mod) calls and defined Objects where needed (typically to find right after the // Input $int comments). It's working now.

What causes Google Maps javascript exceptions?

I pretty consistently get GMaps API javascript exceptions that look like the following:
Ve.k is null or not an object (FF & IE)
b.k is null or not an object (FF & IE)
a is null (FF)
a.$e is undefined (FF)
Uncaught TypeError: Cannot read property 'k' of undefined (chrome)
Often the exception occurs during an eval of some expression in javascript in the bowels of the GMaps API
Almost anything can cause one of these to pop up, displaying an overlay on the map or a mouse click event for example.
I've been scouring my code for some time looking for offending overlays, and event handlers, but so far no relationship found. I've had this happen on a naked map with no overlays or handlers active.
Certain versions of the API will not crash on certain browsers, but it's hit and miss and I still have this sinking susspicion that something in the environment is giving GMaps a hard time (eg. maybe Facebook Connect, Google Analytics, my code...)
Does anyone have a handle on what causes these?
After spending quite a bit of time rolling back operations that affected the map 1 by 1, I finally got to the line(s) that caused this problem.
First, if I removed the call to setUIToDefault() the problem went away, this was unacceptable to me both because I wanted the default UI and that's a lame way to solve the problem. So many more map operations later I came to the GWT calls:
mapWidget.setHeight()
mapWidget.setWidth().
For those not familiar with GWT these two calls will ultimately translate to the following javascript template call:
element.style['height'] = height;
where 'element' in this case is the div that contains the map and height on the RHS of the expression is something like "690px".
That was all it took to derail the maps API.
The fix? Setting the size of the map div prior to instantiating the map.
You tell me, bug in the maps api or just a major feature lack? I'm going to check w/ the maps folks.
Just the perils of using a minified, obfuscated Javascript library I am afraid. There is no discrete group of errors that result in the exceptions you are seeing, but you can be sure that they are a result of a bug in your own code. I use Google maps pretty extensively and have regularly seen these types of errors. In 100% of cases, the bug was mine.
If you post (either here or in new questions) specific examples of pages that generate these errors, we can check them out and hopefully fix them.
I would have to guess it would be your code (not to say your a bad programmer) or another library interfering. I've been using the Google MAPS API happily for about 1 year now* and never had the first exception. The only time I've ever gotten an error message was when I was adding the balloon thingy.
*The website looks like crap but it was a high school project for my county fair and I couldn't use any server side stuff.
Edit: After reading your comment I'm wondering if you included a proper DOCTYPE? Check and see if you have it.

Categories

Resources