I have a maven project with folders like myproject/src/main/resources/public. I am using this maven project just to make a war and deploy my UI code (containing HTML5, JavaScript(with jQuery), CSS etc) to tomcat server and nothing java related.
And inside public folder, I have index.html and builder.js files defined.
index.html which has the following line:
<button type="button" id = "bButton " onclick="location.href='https://myserver-dev.com/Builder/builder.html'">Builder</button>
And another JS file builder.js where I am setting env variable like this:
// var envURL = "http://localhost:8080";
var envURL = "https://myserver-dev.com";
//var envURL = "https://myserver-test.com";
I was thinking of creating a separate JS file, maybe something like properties.js or env.js and put the following in it so that I can just import it in html and js files whenever needed:
// var envURL = "http://localhost:8080";
var envURL = "https://myserver-dev.com";
//var envURL = "https://myserver-test.com";
If I do that what would be the best way to get the envURL inside index.html and builder.js at appropriate places?
Related
I am new to the protractor, and trying to create a project in cucumber using POM. Following is the structure of the project:
In the addCustomerPage.js, I have mentioned the locators as well as the functions to perform a test:
var addCustomerPage = function () {
var BankManagerButton = element(by.buttonText('Bank Manager Login'));
***Other locators*****
this.create = async function(fName,lName,pCode){
await BankManagerButton.click();
****rest of the steps*****
}
}
module.exports = new addCustomerPage();
But when in the spec.js, import the above class, on running the code, it throws the error:
E/launcher - Error: Error: Cannot find module '../pages/addCustomerPage'
Following is the spec.js file's code:
var {
setDefaultTimeout
} = require('cucumber');
const {
expect
} = require('chai');
setDefaultTimeout(10 * 1000);
var addCustomerPage = require('../pages/addCustomerPage');
Given('I open the application and click on create customer button', async function () {
**code*****
});
When('I enter {string}, {string}, {string}', async function (fname, lname, pcode) {
return await addCustomerPage.create(fname, lname, pcode);
});
However, this works fine if the pages folder is under the features folder. Can anyone help on what am I doing wrong here?
../
The symbol above is signalling to go up one file directory.
When the variable is declared like this...
var addCustomerPage = require('../pages/addCustomerPage');
... your computer will go up one folder level from the current directory and search for the pages folder and not find it.
When you copied the pages folder and put it under the feature folder, it can detect it because it falls under the directory that you were searching it for
The solution is to:
Just paste your pages folder under features
or
Modify the file path in the variable to where your pages folder is located
Im guessing you have to go up a directory or two, so use this command ../ to get to where your page folder is
var addCustomerPage = require('../../pages/addCustomerPage');
The idea is to modify the file path to wherever the page folder might be
I am trying to simply access a JavaScript file from within an HTML file using the script src attribute, and I have been unable to do so. Both files are in my functions folder.
I have the following Cloud Function index.js file in my functions folder:
const functions = require('firebase-functions');
const db = require('./admin');
var viewerApp = require('./viewerApp');
exports.view = functions.https.onRequest(viewerApp);
the viewApp.js file looks like this:
const express = require("express");
const fs = require('fs');
const viewerApp = express();
module.exports =
viewerApp.get('/:collection_name/:id', (req, res) =>
{
var viewerHTML = fs.readFileSync('./viewerApp.html').toString();
var id = req.params.id;
var collection_name = req.params.collection_name;
var rendered_HTML = eval(viewerHTML);
res.send(rendered_HTML);
}
)
You will notice the eval(viewerHTML) statement, which refers to a separate html file called viewerApp.html, which basically contains a template literal and looks like so:
<!DOCTYPE html>
<html lang="en">
<body>
...
</body>
</html>
(if someone has a better suggestion for separating the HTML into a separate file while being able to use ${variables} that would be helpful as well, as eval() is not ideal and perhaps is part of what is causing my problem)
The above works fine, except that I cannot figure out how to reference a JavaScript file located in the same functions folder, which means I would need to include all my JavaScript in the viewerApp.html file, which will be a mess.
I have tried all these possibilities in the viewerApp.html file (to try and refer to a JavaScript file called test.js):
<script src="./test.js"></script>
<script src="/test.js"></script>
<script src="test.js"></script>
<script src=test.js></script>
All of the above yield the following error in the console:
Uncaught SyntaxError: Unexpected token < test.js:2
(I get the same error if I try and refer to a filename that doesn't exist so I suspect a problem in the file path or limitation on the ability to access the local file system)
I don't know what to make of the error being related to a < character, as the content of test.js is simply:
console.log("logging happened");
Any assistance would be MUCH appreciated. Thank you!!
The problem in the end was that I did not initialize and configure firebase hosting which seems to be what allows html/js/css and other static files to be accessible in HTML returned from the cloud function. Once I did that and setup the public folder, I was able to refer to the test.js file by putting it in the public folder. That plus addition tweaks to the rewrite section of the firebase.json file, and I was all set. Following this video helped a lot and contains all the required steps.
I have a really simple website (ASP.NET core) that is a single .html static page and 6 .js files.
In one of the js files are some data that is based on my configuration:
localhost
dev
production
right now, it's hardcoded for my localhost.
Is there way that I can build/package the simple app so that if i say dev or prod in some command line arg, it replaces those values with something from somewhere else?
eg.
in main.js:
var environment = "localhost";
var rooturl = "https://localhost:43210";
and lets imagine i wish to build to my dev server...
var environment = "dev";
var rooturl = "https://pewpew.azurewebsites.com";
Is this possible? To keep things simple, assume I know nothing of JS tools and processes. (it's actually the truth, but lets not tell anyone that).
Update (further clarifications):
with 1x static html file and 6x static JS files, I have a static website. So i'm hoping to generate the js files as static files (still) but with the environment data already compiled in it.
you can use some build tools like grunt. where you can define build task which takes the environment parameter and change the variables to the desired values.
another (more simple) way is to dynamicaly create main.js (with dependency on the environment) file with your backend and the frontend will load it when it starts. src of the script tag can be the asp script, where the output is javascript
This is a snippet from a project in which I do just that. I replace various place holders with values stored in the environment variables.
This example is based on a linux environment, so I used sed to modify the file in-place, however you could just as easily read the file into memory, do the replace and write it back to disk.
grunt.task.registerTask('secretkeys', 'Replace various keys', function() {
var oauth;
try{
oauth = JSON.parse(process.env.oauthKeys).oauth;
}
catch(e){
oauth = {google:{}};
}
var replaces = {
'==GOOGLECLIENTID==':oauth.google.client_id || '{**GOOGLECLIENTID**}',
'==GOOGLESECRETKEY==':oauth.google.client_secret || '{**GOOGLESECRETKEY**}',
'==SECRETKEY==':oauth.secret || '{**SECRETKEY**}',
'==LOCALAUTH==':oauth.login,
};
const child = require('child_process');
grunt.file.expand('bin/**/*.json').forEach(function(file) {
grunt.log.write(`${file} \n`);
for(var key in replaces){
var cmd = 'sed -i s~{{orig}}~{{new}}~g {{file}}'
.replace(/{{file}}/g,file)
.replace(/{{orig}}/g,key.replace(/~/g,'\\~'))
.replace(/{{new}}/g,replaces[key].replace(/~/g,'\\~'))
;
grunt.log.write(` - ${key} \n`);
//grunt.log.write(` ${cmd} \n`);
child.execSync(cmd);
}
});
});
Hopefully you can modify to your purposes.
EDIT : I am reconsidering my answer, you are modifying javascript on a windows environment. You are likely better using PowerShell
(gc script.js) `
.replace("==GOOGLECLIENTID==",$Env:GoogleClientId) `
.replace("==SECRETKEY==",$Env:SecretKey) `
> script-build.js
So after re-reading your question, I realize there is a better solution that I have used in the past. My other answer is still relevant, so I'll leave it.
It may be simplest to just create a config file in the same folder.
<html>
<head>
<script type="text/javascript" src="config.js" ></script>
<script type="text/javascript" src="myscript.js" ></script>
</head>
<body>
ask me your questions, bridgekeeper
</body>
</html>
config.js
var config = {
'colour': 'yellow'
};
myscript.js
var user = prompt("What is your favourite colour?", "");
if(user !== config.colour){
alert("No BLUE! Ahhh....");
}
else{
alert("You may pass");
}
This is the technique I use when developing simple HTA apps for use around the office.
Check out envify. You can run it from the command line. https://github.com/hughsk/envify
sudo npm install -g envify
Say you have
var myVar = process.env.MYVAR;
Run from the command line
MYVAR=somevalue envify input.js > output.js
and the output js file should have
var myVar = 'somevalue';
Is there a way in a Node.js Jake build to wait until a certain file has been copied, and advance to do some operation only after the destination file can be found? I think this question pretty much comes down to "is there a way to copy files synchronously in Node.js/Jake?" (Perhaps something else than writing something from scratch, using the combination of fs.readSync and fs.writeSync.)
Background:
I'm developing a web app that is run on Node.js (with Express) during development, but will be deployed on a Java server in production. (We use Jade and Stylus in the client and Express enables us to run the app without generating all the HTML files etc. and deploying it after every change.)
I use Jake for making the build, i.e. generating HTML files from Jade files and CSS from Stylus files etc. Now I'm also trying to concatenate all of the app's JavaScript files into one minimized file and change all the HTML files to use that instead of all the separate JS files that are used in "raw" form during development.
However, I now have a problem with that last step. My idea was to copy all of my Jade files into a temporary directory for the deployment build and replace the reference (in a Jade file used as a header on all HTML pages) to a list of all separate JS files to the one that has just been generated by concatenating and minimizing the whole bunch. But as I first copy all of the Jade files to another location (which happens asynchronously) and try to edit one of the files, opening the file always fails since the copy operation hasn't really finished yet.
This is what I have now (in a simplified form) in my jakefile:
var fs = require('fs');
var fse = require('fs-extra');
var path = require('path');
var glob = require('glob');
var Snockets = require('snockets');
var snockets = new Snockets();
// generating the minimized JS file
snockets.getConcatenation(baseDir + '/scripts/all.js', { minify: true }, function(err, allJs) {
if (err) {
throw err;
}
fs.writeFileSync(generatedJsFileName, allJs);
});
// copying all the Jade files to a temp dir
glob.sync('**/*.*', {
cwd : srcDir
}).forEach(function(file) {
var loadPath = srcDir + '/' + file;
var savePath = targetDir + '/' + file;
fse.mkdirsSync(path.dirname(savePath));
fse.copy(loadPath, savePath);
});
// trying to read one of the copied files (which fails, since the file cannot be found yet)
fs.readFile(targetDir + '/views/includes/head.jade', 'utf8', function(err, data) {
...
});
This might be a stupid question, and a stupid way to try to solve the problem in the first place. So, also suggestions for a better approach are very welcome.
Update:
I also tried using Parseq, putting each operation (creating the JS file, copying the Jade files, reading one file) in its own function, but even that gives me the same error. If I run the script several times without deleting the target directory of the copy operation in between, the file can be found. So e.g. the path is correct and the problem really seems to be about timing.
I didn't really find an answer to the main question so I don't know if this helps anyone else facing the same problem. But I did find a way to get around the problem.
I ended using the same original Jade files for the two different conversions, but in the second conversion I use a custom js function to change the script tag reference to point to the minified file.
I.e.
var data = jade.compile(str, { filename: file, pretty: true })({
css: function(path) {
return '<link rel="stylesheet" href="/styles/' + path + '.css" />';
},
js: function(path) {
var name = '<script src="/scripts/';
if (path == 'all') {
name += generatedJsFileName;
}
else {
name += path + '.js';
}
name += '"></script>';
return name;
}
});
It might not be the prettiest workaround but it works.
I got to have this kind of script that will automatically register the following dll files the computer need to run my program. Manual copying of the required dll into the system32 does not actually register that dll as what I saw, that's why I will try using a script that will run from autorun to register this dll. I heard about using "windows script host" but I find it hard to learn especially when it comes to registering dll file into system32. Any suggestions guys?
I recommend you to create MSI package, it's easiest then you may expect.
Try advanced installer : http://www.advancedinstaller.com/download.html
You can use it free for simple projects like yours.
Lets break down your problem:
1) Assuming that you have copied required dlls in a folder ( folderPath=path to this folder ) & you have list of dll files in "temp.txt" file in following format-
xolehlp.dll
xpob2res.dll
xpsp1res.dll
2) Copying dlls from one folder to system32 folder
3) Register this dlls
Here is the required code:
Option Explicit
Dim oFSO, WshShell, oTxtFile, sLine ,filePath, folderPath
Const ForReading=1
filePath ="C:\Documents and Settings\Amol\Desktop\Temp\FileList.txt"
'' Filepath is your local path to txt file
folderPath = "C:\Documents and Settings\Amol\Desktop\Temp\"
'' folderPath is your path to folder from where you want to copy the dlls
Set oFSO = CreateObject("Scripting.FileSystemObject")
Set WshShell = CreateObject("WScript.Shell")
Set oTxtFile = oFSO.OpenTextFile(filePath, 1)
Do Until oTxtFile.AtEndOfStream
sLine = oTxtFile.ReadLine
oFSO.CopyFile folderPath & sLine,"C:\WINDOWS\system32\"
sLine = "regsvr32 C:\WINDOWS\system32\"&sLine
WshShell.Run sLine
Loop
oTxtFile.Close