I have an html file with a link to css file bundle and at the bottom of that html file I have a
div which is a container for all javascript code and a javascript bundle like this
header excerpt from an auto generated html file
<head>
<link rel="stylesheet" type="text/css" href="./wicket/resource/com.demo.WicketApplication/bundle-ver-54903C08BD33E9FB5DA355BE40331F02.css" nonce="o8ucNjn605sWzLMeVlFgM-kh" />
</head>
body excerpt with javascript file and code
<script type="text/javascript" src="./wicket/resource/com.demo.WicketApplication/bundle-ver-E39F0FD375F78ED454CD6F59F3C635D4.js" nonce="o8ucNjn605sWzLMeVlFgM-kh"></script>
<script type="text/javascript" id="wicket-ajax-base-url" nonce="o8ucNjn605sWzLMeVlFgM-kh">
/*<![CDATA[*/
Wicket.Ajax.baseUrl="?1";
/*]]>*/
</script>
<script type="text/javascript" id="our_callback_url" nonce="o8ucNjn605sWzLMeVlFgM-kh">
/*<![CDATA[*/
our_callback_url = './?1-5.0-test';
/*]]>*/
</script>
<script type="text/javascript" nonce="o8ucNjn605sWzLMeVlFgM-kh">
/*<![CDATA[*/
Wicket.Event.add(window, "domready", function(event) {
tripleview.initMyComponent('#id2', tripleview.postJson.bind(tripleview, "./?1-5.0-test"));
Wicket.Event.publish(Wicket.Event.Topic.AJAX_HANDLERS_BOUND);
;});
/*]]>*/
</script>
So, when I navigate to my page with open devTools window the first time I get
I get warnings but no errors
DevTools failed to load SourceMap: Could not load content for chrome-extension://gighmmpiobklfepjocnamgkkbiglidom/include.preload.js.map: HTTP error: status code 404, net::ERR_UNKNOWN_URL_SCHEME
DevTools failed to load SourceMap: Could not load content for chrome-extension://gighmmpiobklfepjocnamgkkbiglidom/include.postload.js.map: HTTP error: status code 404, net::ERR_UNKNOWN_URL_SCHEME
But when I close devtools window and reopen it again I get an error
Refused to load the stylesheet 'http://localhost:8080/wicket/resource/com.demo.WicketApplication/bundle-ver-54903C08BD33E9FB5DA355BE40331F02.css' because it violates the following Content Security Policy directive: "style-src 'nonce-t0wrytDNiwGcyBiQ64Uln-uP'". Note that 'style-src-elem' was not explicitly set, so 'style-src' is used as a fallback.
error in devtools after reopening devtools window
My question is why do I get this error only with css file but not javascript file. And why this error happens after I reopen devtools after closing devtools window?
P.S
Chrome version: Version 81.0.4044.113 (Official Build) (64-bit)
I had same warnings in my project. In my case gighmmpiobklfepjocnamgkkbiglidom is AdBlock extention. If you open chrome-extension://gighmmpiobklfepjocnamgkkbiglidom/include.preload.js.map you will see some information about your extention. In my case it is:
{"version":3, <...> "webpack:///../adblock-betafish/alias/include.preload.js",<...>
I just turned off AdBlock in "chrome://extensions/" and it helped me.
You can delete AdBlock extension (or turn it off). I hope it will solve your problem.
Related
I'm working on a Flutter web project. The web/index.html file is injecting a JavaScript script which could be simplified as:
<script>
window['dataLayer'] = [];
</script>
So in my flutter code, I can do:
#JS()
import 'package:js/js.dart';
#JS('dataLayer.push')
external void push(data);
push(myData);
to push myData in the window.dataLayer array.
However, in the tests, when I'm running
flutter test --platform chrome
I'm getting the error
TypeError: Cannot read properties of undefined (reading 'push')
when I call
push(myData);
because window['dataLayer'] has never been created.
How can I inject some javascript scripts the same way I can do in the index.html?
It is possible to load a custom HTML file while running the tests, see the instructions of the package test.
If your test file name is folder/my_test.dart, then you can create a html file named (folder/my_test.html):
<!doctype html>
<html>
<head>
<title>Custom HTML file title</title>
<link rel="x-dart-test" href="my_test.dart">
<script src="packages/test/dart.js"></script>
<script>
window['dataLayer'] = [];
</script>
</head>
</html>
See this StackOverflow question.
and then you can run
dart test --platform chrome
However, this is only supported with dart test and not flutter test, see this issue. In it, they recommend writing an integration test instead.
I want to use modules in my javascript and html. When i use systemjs with version 5, i am getting error, in github i cant see the steps to configuration. If i removed System.config from below code, at that time i getting CORS issue.
What are the package i have to use to run modules in javascript and html
How to set the configurations for latest version
<!-- <script src="node_modules/traceur/bin/traceur.js"></script>
<script src="node_modules/systemjs/dist//system.js"></script> -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/systemjs/5.0.0/system.js"></script>
</head>
<body>
<script>
//Configuration
System.config({
'meta': {
'./js/*.js': {
format: 'esm'
}
}
});
System.import('./js/app.js');
</script>
I am getting Error : index.html:18 Uncaught TypeError: System.config is not a function. if I removed system.config i am getting Error : Unable to resolve bare specifier "js/app.js" from file:///C:/Train/ES6/systemjss/ at throwBare (system.js:184) at resolveImportMap (system.js:180) at system.js:734
I'm trying to develop an apache cordova application using Visual studio tools for apache cordova and the facebook connect plugin. With this plugin i'm trying to implement login with facebook.
I installed the plugin from the option custom / plugins, introducing the git repository https://github.com/Wizcorp/phonegap-facebook-plugin
The plugin was successfully installed, the solution compiles correctly.
In the index.html I included the script after platform overrides script:
...
<script type="text/javascript" src="cordova.js"></script>
<script type="text/javascript" src="scripts/platformOverrides.js"></script>
<script type="text/javascript" src="facebookConnectPlugin.js"></script>
<script type="text/javascript" src="scripts/index.js"></script>
</body>
..
The first question is that the facebookConnectPlugin.js was not automatically included within the www root folder in the plugin installation, in this case I don't know how to the application find this script, installing camera.js plugin happened the same but i had not problems in the inclusion, it seem the browser found the js. Where must be located facebookConnectPlugin.js? Do we have to include using the plugins folder? ej:
When I debug the project and tried to launch login with the following instructions it doesn't work:
var fbLoginSuccess = function (userData) {
alert("UserInfo: " + JSON.stringify(userData));
}
function initLogin() {
facebookConnectPlugin.login(["public_profile"],
fbLoginSuccess,
function (error) { alert("" + error) }
);
}
The message I found with Ripple -Nexus (galaxy) emulator is:
"I Haz cheeseburger!
FacebookConnectPlugin.login
We seem to be missing some stuff :(
What is kinda cool though you can fill in the textarea to pass a json object to the callback you want to execute"
Summary:
Which is the src to include the facebookConnectPlugin.js?
Why I found an error with the emulator?
Best regards.
I use "babel" command to transpile ES6 script to ES5.
Ex: babel testES6.js --out-file testES5.js
It works fine. My question is how to transpile inline javascript.
For Ex: test.html
<html>
<head>
<script type="text/javascript">
//ES6 scripts
</script>
</head>
</html>
According the babel docs, it supports scripts typed text/ecmascript-6 or text/babel. Add the browser build into your page and set proper type for your scripts.
You can use this code and enjoy :)
<script src="https://cdnjs.cloudflare.com/ajax/libs/babel-standalone/6.21.1/babel.min.js"></script>
<script type="text/babel">
</script>
During the development process, I've been using elm-reactor to test my one-page Elm application. But for production deployment, I would like to just store the compiler's output as static files on a webserver.
How do I compile an Elm page into a standalone pair of HTML + Javascript files?
Use elm-make to compile your Elm application to elm.js (target the module that defines main).
Create your own HTML file that includes that script and a script in the body that executes Elm.<Module-that-defines-main>.fullscreen()
Example
App.elm
module App where
import Text
import Signal
import Graphics.Element (Element)
main : Signal Element
main = "Hello World!" |> Text.asText |> Signal.constant
elm-make App.elm (creates elm.js)
App.html
<!DOCTYPE html>
<html>
<head>
<script src="elm.js" type="text/javascript"></script>
</head>
<body>
<script type="text/javascript">Elm.App.fullscreen()</script>
</body>
</html>
The answer to this ticket on the github project page is also quite helpful:
Finally, use this command to compile the file into a single, stand-alone HTML file.
$ elm make start-test.elm --output index.html