How to print output on new line? - angularjs

case Constants.QUEUEESCALATION:
{
var body = '';
angular.forEach(caseChangeRecord, function(change, key) {
body += change.fieldName + Constants.QUEUEESCALATION_MSG + checkIfDate(change.originalValue) + Constants.TO + checkIfDate(change.newValue) + Constants.FULLSTOP + '\n';
});
return {
objectType: Constants.TYPE_INFO,
objectIcon: 'fa-list-ul',
objectBody: body
};
}
After appending \n in last it will shown output on same line instated of new line.
ACTUAL OUTPUT:
assignedQueue has been changed from Q1 to Q48. assignedQueueDate has been changed from 06/27/2017 to 07/03/2017.
REQUIRE OUTPUT:
assignedQueue has been changed from Q1 to Q48.
assignedQueueDate has been changed from 06/27/2017 to 07/03/2017.

Add a space before \n. It's working from my side.
body += change.fieldName + Constants.QUEUEESCALATION_MSG + checkIfDate
(change.originalValue) + Constants.TO + checkIfDate(change.newValue) +
Constants.FULLSTOP + ' \n';
Update :
and your html should be like using innerHtml
<div class="timeline-body" [innerHTML]="item.body"></div>

Divide rows by '\n' token and wrap your item.body into <pre>:
<div class="timeline-body">
<pre>
{{item.body}}
</pre>
</div>

Related

Klarna checkout - using React & Node

I'm trying to implement Klarna checkout to accept payments.
When creating an order (first step of the checkout) you receive a "html_snippet" as response from Klarnas API (in my case to express backend). It requires that this snippet is shown in the front end (in my case react).
Having read Klarnas documentation, I still cant figure out how to show this html snippet in react. Even copy pasting the exact snippet gives me 41 error warnings.
The snippet looks like this:
html_snippet: '<div id="klarna-checkout-container" style="overflow: hidden;">\n' +
' <div id="klarna-unsupported-page">\n' +
' <style type="text/css">\n' +
' #-webkit-keyframes klarnaFadeIn{from{opacity:0}to{opacity:1}}#-moz-keyframes klarnaFadeIn{from{opacity:0}to{opacity:1}}#keyframes klarnaFadeIn{from{opacity:0}to{opacity:1}}#klarna-unsupported-page{opacity:0;opacity:1\\9;-webkit-animation:klarnaFadeIn ease-in 1;-moz-animation:klarnaFadeIn ease-in 1;animation:klarnaFadeIn ease-in 1;-webkit-animation-fill-mode:forwards;-moz-animation-fill-mode:forwards;animation-fill-mode:forwards;-webkit-animation-duration:.1s;-moz-animation-duration:.1s;animation-duration:.1s;-webkit-animation-delay:5s;-moz-animation-delay:5s;animation-delay:5s;text-align:center;padding-top:64px}#klarna-unsupported-page .heading{font-family: "Klarna Headline", Helvetica, Arial, sans-serif;color: rgb(23, 23, 23);font-size: 36px;letter-spacing: -0.2px;-webkit-font-smoothing: antialiased;}#klarna-unsupported-page .subheading{font-family: "Klarna Text", "Klarna Sans", Helvetica, Arial, sans-serif;color: rgb(23, 23, 23);-webkit-font-smoothing: antialiased;line-height: 28px;font-weight: 400;font-size: 19px;max-width: 640px;margin: 20px auto;}#klarna-unsupported-page .reload {cursor: pointer;outline: none;-webkit-tap-highlight-color: rgba(255, 255, 255, 0);border-width: 1px;background-color: rgb(38, 37, 37);border-color: rgb(38, 37, 37);padding: 15px 24px;margin-top: 15px;color: rgb(255, 255, 255);font-family: "Klarna Text", "Klarna Sans", Helvetica, Arial, sans-serif;font-weight: 500;text-rendering: geometricprecision;font-size: 100%;}\n' +
' </style>\n' +
' <h1 class="heading">Something went wrong</h1>\n' +
' <p class="subheading">Sorry for any inconvenience, please try reloading the checkout page or try again later.</p>\n' +
' <p class="subheading">If the problem persists it maybe be because you are using an old version of the web browser which is not safe nor compatible with modern web sites. For a smoother checkout experience, please install a newer browser.</p>\n' +
' <button class="reload" onclick="reloadCheckoutHandler && reloadCheckoutHandler()">Reload checkout</button>\n' +
' </div>\n' +
' <script id="klarna-checkout-context" type="text/javascript">\n' +
' /* <![CDATA[ */\n' +
' var reloadCheckoutHandler;\n' +
' (function(w,k,i,d,n,c,l){\n' +
' w[k]=w[k]||function(){(w[k].q=w[k].q||[]).push(arguments)};\n' +
' l=w[k].config={\n' +
' container:w.document.getElementById(i),\n' +
" ORDER_URL:'https://js.playground.klarna.com/eu/kco/checkout/orders/dae844ba-c44a-6e55-b5ad-9afe9055e1f4',\n" +
" AUTH_HEADER:'KlarnaCheckout 4mpla37op0i19pv6g054',\n" +
" LOCALE:'en-GB',\n" +
" ORDER_STATUS:'checkout_incomplete',\n" +
" MERCHANT_NAME:'Your business name',\n" +
' GUI_OPTIONS:[],\n' +
' ALLOW_SEPARATE_SHIPPING_ADDRESS:false,\n' +
" PURCHASE_COUNTRY:'gbr',\n" +
" PURCHASE_CURRENCY:'GBP',\n" +
' TESTDRIVE:true,\n' +
" BOOTSTRAP_SRC:'https://js.playground.klarna.com/kcoc/220119-c2c224d/checkout.bootstrap.js',\n" +
" FE_EVENTS_DISABLED:'false',\n" +
" DEVICE_RECOGNITION_URL:'https://js.playground.klarna.com/eu/kco/checkout/orders/dae844ba-c44a-6e55-b5ad-9afe9055e1f4/device_recognition',\n" +
' DEVICE_RECOGNITION_TYPE1:true,\n' +
" DEVICE_RECOGNITION_TYPE3_ORG_ID:'87rxrdob',\n" +
" DEVICE_RECOGNITION_TYPE3_REF:'KLRNA_87rxrdob_dae844ba-c44a-6e55-b5ad-9afe9055e1f4',\n" +
" CLIENT_EVENT_HOST:'https://eu.playground.klarnaevt.com'\n" +
' };\n' +
" n=d.createElement('script');\n" +
' c=d.getElementById(i);\n' +
' n.async=!0;\n' +
' n.src=l.BOOTSTRAP_SRC;\n' +
' c.appendChild(n);\n' +
' try{\n' +
" ((w.Image && (new w.Image))||(d.createElement && d.createElement('img'))||{}).src =\n" +
" l.CLIENT_EVENT_HOST + '/v1/checkout/snippet/load' +\n" +
" '?sid=' + l.ORDER_URL.split('/').slice(-1) +\n" +
" '&order_status=' + w.encodeURIComponent(l.ORDER_STATUS) +\n" +
" '&timestamp=' + (new Date).getTime();\n" +
' }catch(e){}\n' +
' reloadCheckoutHandler = function () {\n' +
' try{\n' +
" ((w.Image && (new w.Image))||(d.createElement && d.createElement('img'))||{}).src =\n" +
" l.CLIENT_EVENT_HOST+'/v1/checkout/snippet/reload?sid='+l.ORDER_URL.split('/').slice(-1)+\n" +
" '&order_status='+w.encodeURIComponent(l.ORDER_STATUS)+'&timestamp='+(new Date()).getTime();\n" +
' window.location.reload();\n' +
' }catch(e){}\n' +
' }\n' +
" })(this,'_klarnaCheckout','klarna-checkout-container',document);\n" +
' /* ]]> */\n' +
' </script>\n' +
' <noscript>\n' +
'Please enable JavaScript.\n' +
' </noscript>\n' +
'</div>'
Anyone been through this journey?
You may have already solved this, but I used Iframe to render the snippet. Make an HTML page with the received snippet inside and use that as the source for your Iframe.
<iframe
title='klarnaCheckout'
className='iframe'
srcDoc={klarnaHtml(klarna.html_snippet)}
frameBorder='0'
></iframe>
export const klarnaHtml = (snippet) => {
return `
<html>
<head> </head>
<body>
<textarea style="display: none" id="KCO">
${snippet}
</textarea
>
<div id="my-checkout-container"></div>
<!-- START - Dont edit -->
<script type="text/javascript">
var checkoutContainer = document.getElementById(
"my-checkout-container"
);
checkoutContainer.innerHTML = document
.getElementById("KCO")
.value.replace(/\\"/g, '"')
.replace(/\\n/g, "");
var scriptsTags = checkoutContainer.getElementsByTagName("script");
for (var i = 0; i < scriptsTags.length; i++) {
var parentNode = scriptsTags[i].parentNode;
var newScriptTag = document.createElement("script");
newScriptTag.type = "text/javascript";
newScriptTag.text = scriptsTags[i].text;
parentNode.removeChild(scriptsTags[i]);
parentNode.appendChild(newScriptTag);
}
</script>
<!-- END -->
</body>
</html>
`;
};

Issue looping through an array response

I was writing an API using the kat.cr API and the IMDB api too in nodejs, I didn't use json.stringify cuz I didn't know about it at the time of writing haha XD, anyway, the problem is that when I loop through the code in 46 through 50, the response remains the same here's an example,
here is the json generated,
{
"MovieList": [{
"title": "Jurassic World",
"imdb": "tt0369610",
"poster_med": "http://ia.media-imdb.com/images/M/MV5BMTQ5MTE0MTk3Nl5BMl5BanBnXkFtZTgwMjczMzk2NTE#._V1_SX300.jpg",
"poster_big": "http://ia.media-imdb.com/images/M/MV5BMTQ5MTE0MTk3Nl5BMl5BanBnXkFtZTgwMjczMzk2NTE#._V1_SX300.jpg",
"genres": ["Action, Adventure, Sci-Fi"],
"items": [{
"torrent_magnet": "magnet:?xt=urn:btih:9D8BB2F07BC40BE4EA8EDAB7F7EB9C70A8AB2892&dn=maze+runner+the+scorch+trials+2015+hc+720p+hdrip+x264+shaanig&tr=udp%3A%2F%2Ftracker.publicbt.com%2Fannounce&tr=udp%3A%2F%2Fopen.demonii.com%3A1337",
"torrent_seeds": "1262",
"torrent_peers": "1306",
"id": "9D8BB2F07BC40BE4EA8EDAB7F7EB9C70A8AB2892"
}]
}, {
"title": "San Andreas",
"imdb": "tt2126355",
"poster_med": "http://ia.media-imdb.com/images/M/MV5BNjI4MTgyOTAxOV5BMl5BanBnXkFtZTgwMjQwOTA4NTE#._V1_SX300.jpg",
"poster_big": "http://ia.media-imdb.com/images/M/MV5BNjI4MTgyOTAxOV5BMl5BanBnXkFtZTgwMjQwOTA4NTE#._V1_SX300.jpg",
"genres": ["Action, Drama, Thriller"],
"items": [{
"torrent_magnet": "magnet:?xt=urn:btih:9D8BB2F07BC40BE4EA8EDAB7F7EB9C70A8AB2892&dn=maze+runner+the+scorch+trials+2015+hc+720p+hdrip+x264+shaanig&tr=udp%3A%2F%2Ftracker.publicbt.com%2Fannounce&tr=udp%3A%2F%2Fopen.demonii.com%3A1337",
"torrent_seeds": "1262",
"torrent_peers": "1306",
"id": "9D8BB2F07BC40BE4EA8EDAB7F7EB9C70A8AB2892"
}]
}]
}
Here is the crawler code :
var kat = require('kat-api');
var IMDb = require('imdb-scraper');
var movieTitle = require('movie-title');
var nameToImdb = require("name-to-imdb");
var movie = require('node-movie');
var fs = require('fs');
var util = require('util');
var log_file = fs.createWriteStream(__dirname + '/main.json', {
flags: 'w'
});
var log_stdout = process.stdout;
var config = '720p 2015'; //This is the line that should be changed if needed!
console.log = function(d) { //
log_file.write(util.format(d) + '\n');
log_stdout.write(util.format(d) + '\n');
};
var kat = require('kat-api');
kat.search({
query: config,
category: 'movies',
language: 'en'
}).then(function(response) {
var quotes = '"';
var startingOfJson = "{" + quotes + "MovieList" + quotes + ":" + "[";
var endingOfJson = "}";
var itemStart = quotes + "items" + quotes + ":" + "[{";
var itemEnd = "}]";
console.log(startingOfJson);
for (i = 0; i <= 20; i++) {
var titleForEverything = movieTitle(response.results[i].title);
movie(titleForEverything, function(err, data) {
console.log("{");
console.log(quotes + "title" + quotes + ":" + quotes + data.Title + quotes + ",");
console.log(quotes + "imdb" + quotes + ":" + quotes + data.imdbID + quotes + ",");
console.log(quotes + "poster_med" + quotes + ":" + quotes + data.Poster + quotes + ",");
console.log(quotes + "poster_big" + quotes + ":" + quotes + data.Poster + quotes + ",");
var genres = quotes + "genres" + quotes + ":" + "[" + quotes + data.Genre + quotes + "]" + ",";
console.log(genres);
console.log(itemStart);
console.log(quotes + "torrent_magnet" + quotes + ":" + quotes + response.results[i].magnet + quotes + ",");
console.log(quotes + "torrent_seeds" + quotes + ":" + quotes + response.results[i].seeds + quotes + ",");
console.log(quotes + "torrent_peers" + quotes + ":" + quotes + response.results[i].peers + quotes + ",");
console.log(quotes + "id" + quotes + ":" + quotes + response.results[i].hash + quotes);
console.log(itemEnd);
if (i == 20) {
console.log("}");
} else {
console.log("},")
}
});
}
}).catch(function(error) {
console.log('an error occured' + error);
});
console.log("]}");
and you can see that the magnet, seeds, hash and peers remain the same for all the results generated! How can I fix this and why does this happen? Thank you! :D
You're committing the classic error of a function inside a loop closing over the loop index i; when the function is executed, i will already have its final value. The easiest way to fix this is with for (let i.

How to add extra column to protractor-html-screenshot-reporter like duration for each "it" block

I am trying to add an extra column to the HTML report. Like duration of each "it" block. I tried this inside jsonparser.js file.
phssr.makeHTMLPage = function(tableHtml, reporterOptions){
var styleTag = phssr.makeHardCodedStyleTag(reporterOptions);
var scrpTag = phssr.makeScriptTag();
var staticHTMLContentprefix = "<html><head><meta charset='utf-8'/>";
//Add title if it was in config setup
if (typeof (reporterOptions.docTitle) !== 'undefined' && _.isString(reporterOptions.docTitle) ){
staticHTMLContentprefix += "<title>" + reporterOptions.docTitle + "</title>";
} else {
staticHTMLContentprefix += "<title></title>";
}
staticHTMLContentprefix += styleTag + scrpTag + " </head><body>";
staticHTMLContentprefix += "<h1>" + reporterOptions.docHeader + "</h1><table class='header'>";
staticHTMLContentprefix += "<tr><th class='desc-col'>Description</th><th class='status-col'>Passed</th>";
staticHTMLContentprefix += "<th class='browser-col'>Browser</th>";
staticHTMLContentprefix += "<th class='os-col'>OS</th><th class='msg-col'>Message</th>";
staticHTMLContentprefix += "<th class='msg-col'>Duration</th>";
staticHTMLContentprefix += "<th class='img-col'>Screenshot</th></tr></table>";
var staticHTMLContentpostfix = "</body></html>";
var htmlComplete = staticHTMLContentprefix + tableHtml + staticHTMLContentpostfix;
return htmlComplete;
}
phssr.getTimestamp = function (date) {
function pad(n) { return n < 10 ? '0' + n : n; }
var currentDate = date !== undefined ? date : new Date(),
month = currentDate.getMonth() + 1,
day = currentDate.getDate();
return (currentDate.getFullYear() + "-" + pad(month) + "-" + pad(day) + " " + pad(currentDate.getHours()) + ":" + pad(currentDate.getMinutes()) + ":" + pad(currentDate.getSeconds()));
}
var sTime = new Date();
var startTime = phssr.getTimestamp(sTime);
console.log("sTime***********************",startTime);
var passCount=0, failCount=0, loopCount=0;
function generateHTML(data){
var eTime = new Date();
var endTime = phssr.getTimestamp(eTime);
console.log("eTime***********************",endTime);
var diffTime = (eTime-sTime)/1000;
console.log("dTime***********************",diffTime);
data.passed? passCount++: failCount++;
var str = '<table><tr>';
str += '<td class="desc-col">' + data.desc + '</td>';
var bgColor = data.passed? 'green': 'red';
str += '<td class="status-col" style="color:#fff;background-color: '+ bgColor+'">' + data.passed + '</td>';
str += '<td class="browser-col">' + data.browser.name+ ':' +data.browser.version + '</td>';
str += '<td class="os-col">' + data.os + '</td>';
var stackTraceInfo = data.passed? '': '<br/><a onclick="showTrace(event)" href="#trace-modal'+loopCount+'">View Stack Trace Info</a><br/> <div id="#trace-modal'+loopCount+'" class="traceinfo"><div>X' + data.trace + '</div></div>';
str += '<td class="msg-col">' + data.message+ stackTraceInfo+ '</td>';
str += '<td class="msg-col">' + diffTime + '</td>';
if(!(reporterOptions.takeScreenShotsOnlyForFailedSpecs && data.passed)) {
str += '<td class="img-col">View </td>';
}
else{
str += '<td class="img-col"></td>';
}
str += '</tr></table>';
loopCount++;
return str;
}
I can see the extra column in the report. The problem was it is not showing the correct time. In the console it is printing like this
sTime*********************** 2015-08-28 13:26:44
Using the selenium server at http://localhost:4444/wd/hub
.eTime*********************** 2015-08-28 13:26:48
dTime*********************** 3.312
.eTime*********************** 2015-08-28 13:26:52
dTime*********************** 7.984
eTime*********************** 2015-08-28 13:26:52
dTime*********************** 7.984
.
Finished in 12.123 seconds
3 tests, 3 assertions, 0 failures
eTime*********************** 2015-08-28 13:26:57
dTime*********************** 12.325
eTime*********************** 2015-08-28 13:26:57
dTime*********************** 12.325
eTime*********************** 2015-08-28 13:26:57
dTime*********************** 12.325
here, I don't know why it is executing two times. In the report it is showing 12.325 for all blocks. I don't know where I am doing wrong. please help me.
Tests:
describe('Title', function() {
it('TESTCASE-1 : Should have a title', function() {
expect(browser.getTitle()).toContain('Test');
});
it('TESTCASE-2 : Should accept a valid email address and password', function() {
element(by.id('email')).sendKeys('*********');
element(by.id('password')).sendKeys('*********');
element(by.css('.btn')).click();
expect(browser.getCurrentUrl()).toEqual('*********/app/#/home');
});
it('TESTCASE-4: Dashboard Selection.....', function(){
var menubutton = element.all(by.css('.btn')).get(0);
menubutton.click();
expect(browser.getCurrentUrl()).toEqual('*************************/students/1');
});
});

Copy a file's contents while ignoring characters between < and > in Java

I'm looking to write a program that reads from a html file and copies the contents but it ignores the html tags without using replaceAll. Also the stripping of html tags must be done in a different method. The file looks like this :
<html>
<head>
<title>My web page</title>
</head>
<body>
<p>There are many pictures of my cat here,
as well as my <b>very cool</b> blog page,
which contains <font color="red">awesome
stuff about my trip to Vegas.</p>
Here's my cat now:<img src="cat.jpg">
</body>
</html>
And I'd like my program to display the following:
My web page
There are many pictures of my cat here,
as well as my very cool blog page,
which contains awesome
stuff about my trip to Vegas.
Here's my cat now:
public static void main(String[] args) {
String html = " <html>\n"
+ " <head>\n"
+ " <title>My web page</title>\n"
+ " </head>\n"
+ " <body>\n"
+ " <p>There are many pictures of my cat here,\n"
+ " as well as my <b>very cool</b> blog page,\n"
+ " which contains <font color=\"red\">awesome\n"
+ " stuff about my trip to Vegas.</p>\n"
+ "\n"
+ "\n"
+ " Here's my cat now:<img src=\"cat.jpg\">\n"
+ " </body>\n"
+ " </html>";
boolean inTag = false;
StringBuilder finalString = new StringBuilder();
int length = html.length();
for (int i = 0; i < length; i++) {
char c = html.charAt(i);
if ('<' == c) {
inTag = true;
} else if ('>' == c) {
inTag = false;
} else if (!inTag) {
finalString.append(c);
}
}
System.out.print(finalString);
}

Ternary operation in check/in checking HTML checkbox

My JavaScript spits out dynamic HTML with one of the fields as checkbox based on a boolean as follows:
<input type="checkbox" disabled='true' (bool == true ? "Checked":"undefined") />
My checkbox always returns checked even if the Boolean is false .
Any suggestions to doing that by ternary operation?
Also i just realized that it would be hard to have id's for each row of checkboxes. Here is how my function currently looks like:
function fnBuildWebSiteClipHtml(name, url, id, allow_removal, use_full_screen) {
var html = "<tr id='wc_" + id + "'>" +
tdstart + "<div style='float: left; width: 20px'><img src='/emm/websiteIcon.do?id="+id+"' height='16px' width='16px'/></div><div style='float: left; vertical-align: middle;'>" + OrionCore.escapeHtml(name) + "</div></td>" +
tdstart + OrionCore.escapeHtml(url) + "</td>" +
tdstart + "<input type='checkbox' disabled='true' " + (allow_removal ? "checked='true'" : "") + "/>" + "</td>" +
tdstart + "<input type='checkbox' disabled='true' " + (use_full_screen ? "checked='true'" : "") + "/>" + "</td>" +
tdstart +
"<table>" +
"<tr>" +
"<td><a href='javascript:fnShowWebsiteclip(" + id + ")'>"+MESSAGES.edit+"</a> | </td>" +
"<td><a href='javascript:fnDeleteWebsiteclip(" + id + ")'>"+MESSAGES.del +"</a></td>" +
"</tr>" +
"</table>" +
"</td>" +
"</tr>";
return html;
}
Line 8 where i check the allow_removal and then following line with check for use_full_screen is what i am trying to have my checkboxes follow. Any suggestions towards that are much appreciated.
Thanks for an already posted response but i am not sure how to fit that here in this situation.
May be you need it?
<body onload="(bool ==true) ? document.getElementById('myTernaryCheckBox').setAttribute('checked', 'checked') : false">
<input type="checkbox" disabled id="myTernaryCheckBox"/>
</body>

Resources