Monaco Editor's AMD loaded breaks loading of external JS libraries - amd

I am trying to import some external libraries, such as
<script src="https://unpkg.com/#babel/standalone/babel.min.js"></script>
The problem is, that the library never mounts when the Monaco editor is already loaded. Upon further investigation, I found out that it is the AMD loader that breaks things. If I remove the loader detection from the header of the lib, everything works fine.
This is the original header:
!function(e,t){
"object"==typeof exports && "undefined" != typeof module
? t(exports)
: "function"==typeof define && define.amd
? define(["exports"],t)
: t((e="undefined"!=typeof globalThis?globalThis:e||self).Babel={})
}
This is the modified code that I change in the header to make it work (I removed the module system detection)
!function(e,t){
t((e="undefined"!=typeof globalThis?globalThis:e||self).Babel={})
}
The question is, how can I make this play nicely together without having to download, modify header and self host external libraries?

Related

Nativescript - platform specific code

I've got an iOS specific code (class definition) and would like to include in a separate ios specific file.
So I created two files
utils2.ios.ts <-- added my code here
utils2.android.ts
And then from another file, I did:
import utils2 = require("./utils2");
But I'm getting an error message that the module is not found.
I had to go this route because I've got a class definition in
the code and if I have just one file, I get a run-time error on Android.
Does typescript support platform specific files?
Or another option - is something like this possible in ts file
if ios
do this
end
Similar to C preprocesser
You can get by with just a utils.ts file and inside it you can do platform specific logic that you mention. Your issue about the module not found is likely just a path issue to that module, not that the module isn't actually there. Also note that Typescript doesn't really "support" platform specific files. Nativescript takes those .android.ts and .ios.ts files and at runtime loads the file you need on the platform running. So just FYI that's not really TS related :)
Nativescript provides a platform module in the tns-core-modules. Import the { isAndroid } or { isIOS } from the platform module in your code and use it as the
if (isAndroid) {
// do android only here
} else {
// ios
}

How do I get django-debug-toolbar to work with dajax?

It seems that dajax is hi-jacking the ajax requests from django-debug-toolbar
Is there anyway to work around this or a known solution?
To fix this issue, set DAJAXICE_XMLHTTPREQUEST_JS_IMPORT = False in your Django project settings.
By default, Dajaxice includes the XmlHttpRequest.js library:
dajaxice.core.js template
__init__.py
If you disable the inclusion of this third party javascript library, the Django Debug Toolbar can load panels properly. I have not noticed any issues with Dajaxice with the XmlHttpRequest.js library excluded- I believe it is only for compatibility with old IE browsers, though I'm not certain.

Fail to load assembly on a MVC View

Some Context
I have one closed source asp.net MVC application distributed for several customers. I'm trying to develop a extension to include some very specific functionalities that will be used by a single customer (he will also have the extension source code).
I'm developing the extension as another mvc project, loaded as an area. I'm trying to avoid having to deploy the extension binaries in the main application '/bin' folder.
I'm loading the extension assembly and it's dependencies manually in the PreApplicationStartMethod of the main application assembly. The area registration process went fine and the area routes are registered as intended.
The Problem
When I try to load some extension pages, I got a "The view 'xx' or its master was not found or no view engine supports the searched locations." message. I investigated I little and replaced the view contents with a 'Hello' string. The view was rendered correctly.
I tried to produce a minimal that triggers the error and turns out it's the '#model'directive. I tried to figure out what's happening and It's an assembly loading error. I created a minimal view with '#model object' and tried to cast the Model to original type and got the following error message: "Could not load file or assembly 'xxx' or one of its dependencies. The system cannot find the file specified." (this assembly contains the class type used by the view)
Just to confirm the issue, I moved the mentioned assembly to the main application '/bin' folder and everything worked.
I also inserted some model manipulation instructions on the controller, just to investigate if an exception will appear but everything went fine, I could even render a grid using json.
I'm loading every assemly with:
var assembly = Assembly.LoadFrom(file)
BuildManager.AddReferencedAssembly(assembly)
There's something extra I need to do ?
Needed to add the assembly private path
AppDomain.CurrentDomain.AppendPrivatePath(pluginFolder);
Don't know the real explanation for it but I guess it's relates to the use of Assembly.LoadFrom(file) instead of Assembly.Load() and the fact that views are compiled later.

Debugging dynamically loaded Javascript being generated from TypeScript in Chrome

With VS 2012, Web Essentials, TypeScript 0.8.3
There is a TypeScript file "test.ts". It is compiled into "test.js", having a sourceMappingURL at its end.
//# sourceMappingURL=test.js.map
The Javascript file is loaded dynamically with $.getScript. However, when in Chrome Developer Tools I cannot find the source anywhere, so a breakpoint cannot be set.
If I manually edit the generated Javascript by appending a sourceURL, the situation improves.
//# sourceMappingURL=test.js.map
//# sourceURL=test.ts
The name "test.ts" is offered in Chrome in the Sources tree. However, clicking on it opens the Javascript file "test.js". There breakpoints can be set and used.
Actually it does not matter, whether the correct name "test.ts" or any other name is coded.
What should be done, so debugging a TypeScript file, whose generated Javascript file was dynamically loaded, is possible with Chrome?
I also tried Canary. It made no difference.
I am writing to affirm what WhyMe wrote. Appending tag to using jQuery.append() does not add filename to sources tree, but using DOM element to .appendChild DOES add filename to sources tree.
var fileref = document.createElement('script');
fileref.setAttribute("type", "text/javascript");
fileref.setAttribute("src", 'Scripts/app/Views/Management/Spock.js');
document.getElementsByTagName("head")[0].appendChild(fileref)
Spock.js will be in the correct folder in Sources tree.
Using //# source=Path_to_file works, but
A. must have the pathing correct, and
B. filename appears under <No Domain>; which is really ugly.
PS - I do not have 50 reputation points, so I cannot reply as a comment next to WhyMe's comment, but I can add an Answer?
Working in Chrome Canary (25.0.1364.172 m), and using require.js to load scripts dynamically, I can set and use breakpoints on the typescript files:
NB that this only works on code which matches some JS output - so (logically enough) you cannot set a breakpoint anywhere inside an interface definition.
I'm not sure if using require.js for your on-demand script loading is an option. If so, it should fix your problem.
$.getScript would probably load the file using xmlhttp and adding the javascript later to the DOM thus the browser cannot map the javascript to the js breakpoint
Requirejs adds a script tag with a src attribute so the browser can still hit the breakpoints

How can I use Prototype in a Firefox extension?

I understand that jQuery is the preferred Javascript framework for Firefox extensions, but I'm comfortable with Prototype and need to implement a simple Firefox extension.
Unfortunately, I'm having trouble invoking a Prototype method. Each method call is resulting in a no-op: there are no errors or other signs the method call occurred.
Here's the overlay code:
<overlay id="liteextension-overlay" xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
This call to a Prototype method returns an empty array, even though there are divs in the page:
var all_divs = $$('div');
The "prototype.js" file lives in the same dir as the XUL file.
Using libraries like prototype and jquery inside a Firefox extension is a complicated thing. The problem is that the JQuery is not loaded in the same context when loaded from XUL than when loaded from a webpage. So if you are trying to manipulate stuff in a page, a library loaded in XUL will not see the page DOM where it expects it to be. With JQuery (not sure about prototype) you can solve this by pointing to the right context.
Second, importing libraries inside an extension in a browser.xul overlay will put all functions and variables defined in the library in the global namespace, potentially conflicting with other extensions and even the Firefox code. This could cause a big mess.
There is more information in this forum post, it is about JQuery, but the same problems apply... maybe the suggested solutions could be useful for you:
http://forums.mozillazine.org/viewtopic.php?f=19&t=1460255

Resources