What are possible causes for differing behaviors in jsFiddle and in local context - jsfiddle

Upon invsetigating 'mu is too short's answer to this question, I noticed that I get different behaviour in jsFiddle than in my local context for the exact same script. Any clues as to why that is?
Note:
I am not getting any javascript errors in Firefox's error console in the local context.
UPDATE:
I tried grabbing the HTML from fiddle.jshell.net/ambiguous/ZEx6M/1/show/light to a local file and loading that local file in Chromium browser and I got the following errors in the javascript console:
GET file:///css/normalize.css undefined (undefined) /css/normalize.css
GET file:///css/result-light.css undefined (undefined) /css/result-light.css
Resource interpreted as Script but transferred with MIME type application/empty jquery.scrollTo-1.4.2.js:-1
Resource interpreted as Script but transferred with MIME type text/plain jquery.viewport.js:-1
I can get rid of these javascript errors by downloading the files and modifying the <script> tags, but it doesn't solve the problem. The page still scrolls down to the very bottom. Also these errors appear even in the working (jsFiddle) version.
I also tried the same process in Konqueror. Result: the script does absolutely nothing.

Don't use separate files for CSS and javascript. Just bring everything into HTML file (using inline javascript and inline CSS) and you should be OK.
Or, run a web server locally to serve the javascript file (with the correct MIME type) and use relative paths to CSS.

Related

Adobe analytics with vue js adding external script

Im struggling to add adobe analytics external scripts to my Vue js project. The client uses Adobe analytics and im battling to add it to the project without the project complaining.
The external adobe script looks like the following:
//assets.adobedtm.com/file.min.js with async
Then it is required that you end it by adding the following just before the closing body tag:
<script type="text/javascript">_satellite.pageBottom();</script>
When the project starts it complains in console that $ is not defined because it is defined in webpack when i start the project and im guessing its not finding the alias.
This is the error:
VM29714:3 Uncaught ReferenceError: $ is not defined
Then further down it complains that it doesnt know what _satellite is:
login:54 Uncaught ReferenceError: _satellite is not defined
I just need the scripts and satellite close to be added to the project, the rest will work once these are added.
Ive tried added the scripts by injecting them into the head tag on runtime but that also doesnt work.
If you are implementing Adobe DTM, you cannot inject the header script dynamically. It must be placed directly on the page without async or deferred attributes.
If you are implementing Adobe Launch, you can inject the header script dynamically and asynchronously. And if you do this, you do not include the footer (_satellite.pageBottom()) code.
Your script example isn't explicit, but the .min portion implies you are using Adobe Launch.
VM29714:3 Uncaught ReferenceError: $ is not defined
This is not directly related to either Adobe DTM or Launch. You may possibly have some other script or code block deployed inside the DTM or Launch interface that references $, but that's a separate issue to work out. Yes, it may be coming from a DTM or Launch script according to the js console, but keep in mind that DTM/Launch is a tag manager. It hosts and deploys other tags/scripts. So you need to do some digging to see which tag/script from which Rule references it. Start by looking at the stack trace to find out where it's coming from.

vue-material not work md-src with custom svg icon

I generate a project using vue-cli and then run vue add vue-material.
Then I add MdButton and check in the browser
// work
<md-button class="md-icon-button">button</md-button>
Then I add MdIcon and check in the browser
// not work
<md-button class="md-icon-button">
<md-icon md-src="/assets/icons/svg/telegram.svg"></md-icon>
</md-button>
The compilation succeeds, but an error appears in the browser
Uncaught (in promise) The file /assets/icons/svg/telegram.svg is not a
valid SVG.
svg is definitely valid! How to fix?
I ran into this recently; as Leonardo mentioned it was due to the newly-added MIME type check. For some reason, my SVG file was being served up with Content-Type: text/html.
To fix it, I had to change my icons to use require, which (if I understand correctly) causes it to go through a different loader in Webpack which fixes the MIME type. (See here for a bit more info.) Using OP's example, I would change:
<md-icon md-src="/assets/icons/svg/telegram.svg" />
to
<md-icon :md-src="require('/assets/icons/svg/telegram.svg')" />
It seems an issue created because a mime type.
https://github.com/vuematerial/vue-material/pull/1942/commits/74c45f2150e7fc978e536dbc03549d0e8abff47c

Getting error in using SoundJS

I'm using Flash HTML5Canvas document to publish html files.
I want to add audio playback and started using SoundJS but having problems in using it.
I used the following code in the file.
createjs.Sound.registerPlugins([createjs.WebAudioPlugin, createjs.HTMLAudioPlugin, createjs.FlashPlugin]);
But when I publish it and and run it in browser(Chrome, Win7 Pro 64) I get the following error in console.
"Cannot read property registerPlugins of undefined"
When I checked the html source code, soundjs source is not mentioned. easeljs, tween & movieclip sources are mentioned.
How do I get this resolved?
Thanks :)
First I needed to edit the html file produced by flash cc.
I manually added the line
"http://code.createjs.com/soundjs-0.6.1.min.js"></script>
Double clicking the edited html file and running in browser gives HTTP errors.
So in the publish settings of Flash CC, I disabled the 'Overwrite HTML' option and then if I test/publish via Flash CC, Soundjs loads fine. It requires a local server to test it and I missed that part.

How to get html content remotely and open locally

I want to get the content remotely for a html page and open locally in the webview. But I want this html to have access to the Ti namespace, so it implies that the html must be running locally.
Have tried to create the webview passing the content as the "html" parameter, but Ti namespace doesnt work that way.
Then, I tried to write the content to a html file on Ti.Filesystem.applicationDataDirectory. The page opens OK, but the Ti namespace doesnt work on the html either.
Finaly, I created a html file in assets folder on the project and when I get the html code I try to write on it so I could open using 'url' : '/myfile.html'. But when I try to write it gives java.io.IOException: read only
How can I achieve this? Again: I'm trying to get a html content remotely and run locally so I can have access to Ti namespace.
Thanks
I messed up during my testings. Downloading the html and then opening the webview passing the html code to "html" parameter on the webview works just fine. The fireEvent works that way inside the html.
It was not working because it was other problem not related that I fixed.

XUL standalone application not starting

I recently took on a project built on XUL (standalone, using xulrunner) - However I can't get it to properly run.
I'm getting this error when I attempt to start it using the command line (xulrunner.exe ../application.ini -jsconsole):
No chrome package registered for chrome://case_scenario_builder/content/case_scenario_builder.xul
The chrome.manifest file looks like this:
content case_scenario_builder file:chrome/case_scenario_builder/content/ contentaccessible=yes
content jslib jar:chrome/jslib.jar!/
skin case_scenario_builder skin file:chrome/case_scenario_builder/skin/
locale case_scenario_builder en-US chrome/case_scenario_builder/locale/en-US/
Any ideas on where I could start debugging?
I figured it out!
In case anyone else runs into this as well:
It was due to the caching system in place by default and the use of .jar containers instead of folders.
The XUL environment had cached both JS and XUL files - and even after disabling those, I had to extract everything that was in the .jar file to the content folder and update the chrome.manifest file.
Thanks for your suggestions on debugging! - they helped the process.
I guess your manifest just isn't getting loaded. To test that I'd introduce an intentional syntax error and check the error console. E.g. if you put
asdfasd
on its own line, you should get a Warning: Ignoring unrecognized chrome manifest directive 'asdfasd'. in the Error console.
(Note to other experts: initially I wanted to suggest dropping 'file:' prefix and avoiding underscores in the package name, but I tested it on a Firefox nightly, and it works fine.)
Your chrome package clearly didn't get registered. From what I can tell, the reason is the bogus file: prefix, you should drop it when specifying relative paths:
content case_scenario_builder chrome/case_scenario_builder/content/ contentaccessible=yes
Btw, I suspect that you copied contentaccessible=yes from somewhere - you should drop it as well unless you know what it does.