Jaws chrome - When focus on edit button announcing both title and description - javascript
When we do tab focus on edit button, it is announcing lot other information including job title description and aria-label of other two button that are check and cross, it is only happening when we are keeping role="table", it is fine with role="presentation on other hand it is working as expected in NVDA and Firefox"
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style>
button{
width: 50px;
height: 20px;
}
input{
display: none;
}
</style>
</head>
<body>
<div role="table">
<div
role="row"
>
<div
role="columnheader"
class="g-col-3 h3"
>
Alert title
</div>
<div
data-ph-at-id="email-frequency-text"
role="columnheader"
>
Frequency
</div>
<div
role="columnheader"
>
Actions
</div>
<div
role="columnheader"
class="g-col-3 h3"
>
Date Subscribed
</div>
</div>
<div
class="phw-grid phw-pt-6 phw-pb-6 phw-align-items-center"
role="row"
>
<div
class="result-block g-col-3 g-col-md-12 phw-form-group"
role="cell"
>
<div
class="jobTitle ph-a11y-jobTitleName phw-input-group"
>
<div
>
Chime Jobs
</div>
<button
aria-label="Edit Chime jobs"
tabindex="0"
role="button"
>
edit
</button>
<input
type="text"
data-ph-at-id="update-job-title-input"
data-ps="8be1e0cd-input-1"
aria-label="job alert title"
/>
<button
aria-label="Save"
role="button"
data-ph-at-id="submit-updated-job-title-button"
data-ph-component-name="save-button"
data-ps="8be1e0cd-button-2"
>
Check
</button>
<button
aria-label="Cancel"
role="button"
key-role="btnRole"
>
cross
</button>
</div>
<div
class="jobOtherInfo"
data-ph-at-id="job-other-info-block"
>
<span
class="p3"
>Test</span
>
</div>
</div>
<div
class="result-block g-col-3 g-col-md-12"
role="cell"
data-ps="8be1e0cd-div-22"
>
<div
>
<select
aria-label="frequency"
data-ph-at-id="mail-freq-drp-dwn"
class="phw-form-select"
>
<option
data-ph-at-id="mail-freq-drp-dwn-opt"
data-ps="8be1e0cd-option-1"
>
Frequency option
</option>
</select>
</div>
</div>
<div
class="g-col-3 g-col-md-12"
role="cell"
:class="$style['actions-date']"
data-ps="8be1e0cd-div-24"
>
<span
><a
aria-label="View Results "
class="phw-link"
data-ps="8be1e0cd-a-1"
>
view results
</a></span
>
<span
data-ps="8be1e0cd-span-4"
><a
role="button"
href="javascript:void(0)"
class="phw-link"
aria-label="unsubscribe"
>
unsubscribe
</a></span
>
</div>
</div>
</div>
</body>
</html>
Related
Unable to properly add TR to HTML from JS script
I keep getting an indexing error while trying to add TR tags to my HTML using the innerHTML attribute. This is what the JS script looks like.
var myTbody = document.querySelector(".table");
var button = document.querySelector(".add-stock");
var input = document.querySelector(".stock-input");
button.addEventListener("click", function () {
var td = document.querySelectorAll("td");
var row = myTbody.insertRow(td.length + 1);
var cell_univeral = row.insertCell(td.length - 1);
cell_univeral.innerHTML = input.value;
});
And this is the related html document:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Technical</title>
<script
src="https://code.jquery.com/jquery-3.6.0.js"
integrity="sha256-H+K7U5CnXl1h5ywQfKtSj8PCmoN9aaq30gDh27Xc0jk="
crossorigin="anonymous"
></script>
<link
rel="stylesheet"
href="{{url_for('static', filename='css/technical.css')}}"
/>
<link
href="https://cdn.jsdelivr.net/npm/bootstrap#5.1.3/dist/css/bootstrap.min.css"
rel="stylesheet"
integrity="sha384-1BmE4kWBq78iYhFldvKuhfTAU6auU8tT94WrHftjDbrCEXSU1oBoqyl2QvZ6jIW3"
crossorigin="anonymous"
/>
</head>
<body>
<nav class="navbar navbar-expand-lg navbar-dark bg-dark">
<div class="container-fluid">
<a class="navbar-brand" href="/">Home</a>
<button
class="navbar-toggler"
type="button"
data-bs-toggle="collapse"
data-bs-target="#navbarNavAltMarkup"
aria-controls="navbarNavAltMarkup"
aria-expanded="false"
aria-label="Toggle navigation"
>
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarNavAltMarkup">
<div class="navbar-nav">
<a class="nav-link active" href="#">Technical</a>
<a class="nav-link" href="#">Alpha-Beta</a>
<a class="nav-link" href="#">Partition</a>
<a class="nav-link disabled">More</a>
</div>
</div>
</div>
</nav>
<div class="container">
<div class="content">
<div class="top-form">
<form action='#' method="post">
<div class="mb-3">
<label for="exampleInputEmail1" class="form-label"
>Ticker Symbols</label
>
<input
type="text"
class="form-control stock-input"
id="exampleInputEmail1"
aria-describedby="emailHelp"
name="nm"
/>
<div id="symbol" class="form-text">Add stocks one at a time</div>
</div>
<div class="buttons">
<div class="add-button">
<button type="button" class="btn btn-success add-stock">Add</button>
</div>
<div class="submit-button">
<button type="submit" class="btn btn-primary submit-btn">
Submit
</button>
<div class="spinner-border my-spinner hidden" role="status">
<span class="visually-hidden">Loading...</span>
</div>
</div>
</div>
</form>
</div>
<div class="bottom-from">
<table class="table table-hover">
<thead>
<th>Symbol <span class="counter"></span></th>
</thead>
<tbody class="table-body">
</tbody>
</table>
<div class="alert alert-warning" role="alert">
It may take longer for multiple stocks
</div>
</div>
</div>
</div>
<script src="{{url_for('static', filename='script/technical.js')}}"
/></script>
</body>
</html>
Note that for the first two click events i have no problems whatsoever though i get this error when i click again
Uncaught DOMException: Index or size is negative or greater than the allowed amount
It seems like I'm trying to change the innerHTML of an item that is out of range but i honestly don't know what the actual problem is and how to fix it. Thank you for your help
How can i change the content of a modal without closing it?
I have a modal that opens up when i click a button, the thing is that i have 2 buttons that open the same modal but with different contents, so if i click the same button when the modal is opened, it'll close. That's workin' fine, what i wanna do, and can't do, is change the content of the modal without closing it when i click the button that doesn't opened it. Can anyone help me with this? That's the code i'm using: HTML: <!DOCTYPE html> <html lang="pt-BR"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <link rel="stylesheet" href="css/all.min.css"> <link rel="stylesheet" href="css/style.css"> <title>EA - Need for Speed Test Page</title> </head> <body> <header> <nav class="menu-togglers is-visible"> <ul> <li class="dropdown-toggler account" id="account"><i class="far fa-user"></i></li> <li class="dropdown-toggler help" id="help"><i class="fas fa-question"></i></li> <li><i class="fas fa-gamepad"></i></li> </ul> </nav> <!--menu-togglers--> <div class="dropdown-menu is-not-collapsed" id="dropdown-menu"> <img id="close-dropdown" class="dropdown-toggler" src="assets/x-lg.svg"> <div class="account-container menu-container opacity-0"> <div id="account-item" class="menu-content"> <a href=""> <img src="assets/connectEA.svg" alt=""> <p>Sign In</p> </a> </div> <!--account-item--> <div id="account-item" class="menu-content"> <a href=""> <img src="assets/createAccountEA.svg" alt=""> <p>Create Account</p> </a> </div> <!--account-item--> </div> <!--account-container--> <div class="help-container menu-container opacity-0"> <div id="help-item" class="menu-content"> <a href=""> <img src="assets/originIcon.svg" alt=""> <p>Verify my Origin Login</p> </a> </div> <!--help-item--> <div id="help-item" class="menu-content"> <a href=""> <img src="assets/linkAccount.svg" alt=""> <p>Link my Origin to my PSN ID</p> </a> </div> <!--help-item--> <div id="help-item" class="menu-content"> <a href=""> <img src="assets/rescueCode.svg" alt=""> <p>How do I redeem a Code?</p> </a> </div> <!--help-item--> <div id="help-item" class="menu-content"> <a href=""> <img src="assets/errorIcon.svg" alt=""> <p>I can't play online!</p> </a> </div> <!--help-item--> </div> <!--account-container--> </div> <!--dropdown-menu--> </header> <!--header--> <div style="height: 2000px;"></div> <script src="js/hideHeader.js"></script> <script src="js/setMenus.js"></script> </body> </html>
<!DOCTYPE html>
<html lang="pt-BR">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>EA - Need for Speed Test Page</title>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/lity/2.4.1/lity.css" integrity="sha512-NDcw4w5Uk5nra1mdgmYYbghnm2azNRbxeI63fd3Zw72aYzFYdBGgODILLl1tHZezbC8Kep/Ep/civILr5nd1Qw==" crossorigin="anonymous" referrerpolicy="no-referrer" />
<style>
.modalDialog{
width: 90%;
position: fixed;
left: 50%;
right: 0;
margin: 0 auto;
top: 50%;
background: white;
transform: translate(-50%,-50%);
padding: 50px;
max-width: 600px;
border: 1px solid black;
color: black;
}
.modalcont{font-size:16px; color:black;}
</style>
</head>
<body>
<header>
<div class="button">
<a class="modalopen" href="javascript:void(0);" datacontent="testingone">modal open</a>
</div>
</header>
<!--header-->
<footer>
<div id="openModal" class="modalDialog" style="display:none;">
<div>
X
<div class="modalcont">testingone</div>
button one
button two
</div>
</div>
</footer>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js" integrity="sha512-894YE6QWD5I59HgZOGReFYm4dnWc1Qt5NtvYSaNcOP+u1T9qYdvdihz0PPSiiqn/+/3e7Jo4EaG7TubfWGUrMQ==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
<script>
jQuery(document).ready(function(){
jQuery('.modalopen').on('click',function(){
var sun = jQuery(this).attr('datacontent');
jQuery('#openModal').show(500);
jQuery('#openModal .modalcont').html(''+sun+'');
//alert(sun);
});
jQuery('.btn').on('click',function(){
var sun = jQuery(this).attr('datacontent');
//alert(sun);
jQuery('#openModal .modalcont').html(sun);
//alert(sun);
});
jQuery('.close').on('click',function(){
jQuery('#openModal').hide(500);
jQuery('#openModal .modalcont').html();
});
});
</script>
</body>
</html>
Selenium: How to get the html code generated by javascript
Good day!
I'm new to selenium, and I'm trying to get the html code of website.
The driver.page_source() returns
<html><head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge"><script type="text/javascript" src="https://bam.nr-data.net/1/c95cd51526?a=214311961&v=1167.2a4546b&to=ZlBXZxcAVkEHV0NbDV8aYEEMTlpXEg1dU09cWldaCQQXXglTXlxNWFtRVh1PSFoW&rst=369&ref=https://vsmobile.bet9ja.com/bet9ja-mobile/login/&ap=5&be=335&fe=366&dc=363&perf=%7B%22timing%22:%7B%22of%22:1588632697764,%22n%22:0,%22u%22:321,%22ue%22:321,%22f%22:4,%22dn%22:5,%22dne%22:5,%22c%22:5,%22s%22:94,%22ce%22:191,%22rq%22:191,%22rp%22:310,%22rpe%22:313,%22dl%22:325,%22di%22:363,%22ds%22:363,%22de%22:366,%22dc%22:366,%22l%22:366,%22le%22:367%7D,%22navigation%22:%7B%7D%7D&fp=362&at=ShdUEV8aRU8%3D&jsonp=NREUM.setToken"></script><script src="https://js-agent.newrelic.com/nr-1167.min.js"></script><script type="text/javascript">(window.NREUM||(NREUM={})).loader_config={licenseKey:"c95cd51526",applicationID:"214311961"};window.NREUM||(NREUM={}),__nr_require=function(e,n,t){function r(t){if(!n[t]){var i=n[t]={exports:{}};e[t][0].call(i.exports,function(n){var i=e[t][1][n];return r(i||n)},i,i.exports)}return n[t].exports}if("function"==typeof __nr_require)return __nr_require;for(var i=0;i<t.length;i++)r(t[i]);return r}({1:[function(e,n,t){function r(){}function i(e,n,t){return function(){return o(e,[u.now()].concat(f(arguments)),n?null:this,t),n?void 0:this}}var o=e("handle"),a=e(4),f=e(5),c=e("ee").get("tracer"),u=e("loader"),s=NREUM;"undefined"==typeof window.newrelic&&(newrelic=s);var p=["setPageViewName","setCustomAttribute","setErrorHandler","finished","addToTrace","inlineHit","addRelease"],l="api-",d=l+"ixn-";a(p,function(e,n){s[n]=i(l+n,!0,"api")}),s.addPageAction=i(l+"addPageAction",!0),s.setCurrentRouteName=i(l+"routeName",!0),n.exports=newrelic,s.interaction=function(){return(new r).get()};var m=r.prototype={createTracer:function(e,n){var t={},r=this,i="function"==typeof n;return o(d+"tracer",[u.now(),e,t],r),function(){if(c.emit((i?"":"no-")+"fn-start",[u.now(),r,i],t),i)try{return n.apply(this,arguments)}catch(e){throw c.emit("fn-err",[arguments,this,e],t),e}finally{c.emit("fn-end",[u.now()],t)}}}};a("actionText,setName,setAttribute,save,ignore,onEnd,getContext,end,get".split(","),function(e,n){m[n]=i(d+n)}),newrelic.noticeError=function(e,n){"string"==typeof e&&(e=new Error(e)),o("err",[e,u.now(),!1,n])}},{}],2:[function(e,n,t){function r(e,n){var t=e.getEntries();t.forEach(function(e){"first-paint"===e.name?c("timing",["fp",Math.floor(e.startTime)]):"first-contentful-paint"===e.name&&c("timing",["fcp",Math.floor(e.startTime)])})}function i(e,n){var t=e.getEntries();t.length>0&&c("lcp",[t[t.length-1]])}function o(e){if(e instanceof s&&!l){var n,t=Math.round(e.timeStamp);n=t>1e12?Date.now()-t:u.now()-t,l=!0,c("timing",["fi",t,{type:e.type,fid:n}])}}if(!("init"in NREUM&&"page_view_timing"in NREUM.init&&"enabled"in NREUM.init.page_view_timing&&NREUM.init.page_view_timing.enabled===!1)){var a,f,c=e("handle"),u=e("loader"),s=NREUM.o.EV;if("PerformanceObserver"in window&&"function"==typeof window.PerformanceObserver){a=new PerformanceObserver(r),f=new PerformanceObserver(i);try{a.observe({entryTypes:["paint"]}),f.observe({entryTypes:["largest-contentful-paint"]})}catch(p){}}if("addEventListener"in document){var l=!1,d=["click","keydown","mousedown","pointerdown","touchstart"];d.forEach(function(e){document.addEventListener(e,o,!1)})}}},{}],3:[function(e,n,t){function r(e,n){if(!i)return!1;if(e!==i)return!1;if(!n)return!0;if(!o)return!1;for(var t=o.split("."),r=n.split("."),a=0;a<r.length;a++)if(r[a]!==t[a])return!1;return!0}var i=null,o=null,a=/Version\/(\S+)\s+Safari/;if(navigator.userAgent){var f=navigator.userAgent,c=f.match(a);c&&f.indexOf("Chrome")===-1&&f.indexOf("Chromium")===-1&&(i="Safari",o=c[1])}n.exports={agent:i,version:o,match:r}},{}],4:[function(e,n,t){function r(e,n){var t=[],r="",o=0;for(r in e)i.call(e,r)&&(t[o]=n(r,e[r]),o+=1);return t}var i=Object.prototype.hasOwnProperty;n.exports=r},{}],5:[function(e,n,t){function r(e,n,t){n||(n=0),"undefined"==typeof t&&(t=e?e.length:0);for(var r=-1,i=t-n||0,o=Array(i<0?0:i);++r<i;)o[r]=e[n+r];return o}n.exports=r},{}],6:[function(e,n,t){n.exports={exists:"undefined"!=typeof window.performance&&window.performance.timing&&"undefined"!=typeof window.performance.timing.navigationStart}},{}],ee:[function(e,n,t){function r(){}function i(e){function n(e){return e&&e instanceof r?e:e?c(e,f,o):o()}function t(t,r,i,o){if(!l.aborted||o){e&&e(t,r,i);for(var a=n(i),f=v(t),c=f.length,u=0;u<c;u++)f[u].apply(a,r);var p=s[y[t]];return p&&p.push([b,t,r,a]),a}}function d(e,n){h[e]=v(e).concat(n)}function m(e,n){var t=h[e];if(t)for(var r=0;r<t.length;r++)t[r]===n&&t.splice(r,1)}function v(e){return h[e]||[]}function g(e){return p[e]=p[e]||i(t)}function w(e,n){u(e,function(e,t){n=n||"feature",y[t]=n,n in s||(s[n]=[])})}var h={},y={},b={on:d,addEventListener:d,removeEventListener:m,emit:t,get:g,listeners:v,context:n,buffer:w,abort:a,aborted:!1};return b}function o(){return new r}function a(){(s.api||s.feature)&&(l.aborted=!0,s=l.backlog={})}var f="nr#context",c=e("gos"),u=e(4),s={},p={},l=n.exports=i();l.backlog=s},{}],gos:[function(e,n,t){function r(e,n,t){if(i.call(e,n))return e[n];var r=t();if(Object.defineProperty&&Object.keys)try{return Object.defineProperty(e,n,{value:r,writable:!0,enumerable:!1}),r}catch(o){}return e[n]=r,r}var i=Object.prototype.hasOwnProperty;n.exports=r},{}],handle:[function(e,n,t){function r(e,n,t,r){i.buffer([e],r),i.emit(e,n,t)}var i=e("ee").get("handle");n.exports=r,r.ee=i},{}],id:[function(e,n,t){function r(e){var n=typeof e;return!e||"object"!==n&&"function"!==n?-1:e===window?0:a(e,o,function(){return i++})}var i=1,o="nr#id",a=e("gos");n.exports=r},{}],loader:[function(e,n,t){function r(){if(!x++){var e=E.info=NREUM.info,n=d.getElementsByTagName("script")[0];if(setTimeout(s.abort,3e4),!(e&&e.licenseKey&&e.applicationID&&n))return s.abort();u(y,function(n,t){e[n]||(e[n]=t)}),c("mark",["onload",a()+E.offset],null,"api");var t=d.createElement("script");t.src="https://"+e.agent,n.parentNode.insertBefore(t,n)}}function i(){"complete"===d.readyState&&o()}function o(){c("mark",["domContent",a()+E.offset],null,"api")}function a(){return O.exists&&performance.now?Math.round(performance.now()):(f=Math.max((new Date).getTime(),f))-E.offset}var f=(new Date).getTime(),c=e("handle"),u=e(4),s=e("ee"),p=e(3),l=window,d=l.document,m="addEventListener",v="attachEvent",g=l.XMLHttpRequest,w=g&&g.prototype;NREUM.o={ST:setTimeout,SI:l.setImmediate,CT:clearTimeout,XHR:g,REQ:l.Request,EV:l.Event,PR:l.Promise,MO:l.MutationObserver};var h=""+location,y={beacon:"bam.nr-data.net",errorBeacon:"bam.nr-data.net",agent:"js-agent.newrelic.com/nr-1167.min.js"},b=g&&w&&w[m]&&!/CriOS/.test(navigator.userAgent),E=n.exports={offset:f,now:a,origin:h,features:{},xhrWrappable:b,userAgent:p};e(1),e(2),d[m]?(d[m]("DOMContentLoaded",o,!1),l[m]("load",r,!1)):(d[v]("onreadystatechange",i),l[v]("onload",r)),c("mark",["firstbyte",f],null,"api");var x=0,O=e(6)},{}],"wrap-function":[function(e,n,t){function r(e){return!(e&&e instanceof Function&&e.apply&&!e[a])}var i=e("ee"),o=e(5),a="nr#original",f=Object.prototype.hasOwnProperty,c=!1;n.exports=function(e,n){function t(e,n,t,i){function nrWrapper(){var r,a,f,c;try{a=this,r=o(arguments),f="function"==typeof t?t(r,a):t||{}}catch(u){l([u,"",[r,a,i],f])}s(n+"start",[r,a,i],f);try{return c=e.apply(a,r)}catch(p){throw s(n+"err",[r,a,p],f),p}finally{s(n+"end",[r,a,c],f)}}return r(e)?e:(n||(n=""),nrWrapper[a]=e,p(e,nrWrapper),nrWrapper)}function u(e,n,i,o){i||(i="");var a,f,c,u="-"===i.charAt(0);for(c=0;c<n.length;c++)f=n[c],a=e[f],r(a)||(e[f]=t(a,u?f+i:i,o,f))}function s(t,r,i){if(!c||n){var o=c;c=!0;try{e.emit(t,r,i,n)}catch(a){l([a,t,r,i])}c=o}}function p(e,n){if(Object.defineProperty&&Object.keys)try{var t=Object.keys(e);return t.forEach(function(t){Object.defineProperty(n,t,{get:function(){return e[t]},set:function(n){return e[t]=n,n}})}),n}catch(r){l([r])}for(var i in e)f.call(e,i)&&(n[i]=e[i]);return n}function l(n){try{e.emit("internal-error",n)}catch(t){}}return e||(e=i),t.inPlace=u,t.flag=a,t}},{}]},{},["loader"]);</script>
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Adapter</title>
<!-- DEPENDENCIES -->
<link rel="shortcut icon" href="img/login_favicon.ico">
<link href="https://fonts.googleapis.com/css?family=Ubuntu:400,700,400italic" rel="stylesheet" type="text/css">
<link href="css/sportsbook.css" rel="stylesheet">
<link href="https://fonts.googleapis.com/css?family=Roboto:400,500,700">
<link href="css/demo.css" rel="stylesheet">
<link href="css/loginBetin.css" rel="stylesheet">
<link href="css/login.css" rel="stylesheet">
<link href="plugins/bootstrap-3.3.7-dist/css/bootstrap.min.css" rel="stylesheet">
<script src="plugins/jquery-1.12.4/jquery.min.js"></script>
<script src="plugins/bootstrap-3.3.7-dist/js/bootstrap.min.js"></script>
<!-- Javascript client-side code -->
<script type="text/javascript">
var lang = "";
function openSelection(mode, uri){
var url = "https://vsmobile.bet9ja.com" + uri + (uri.indexOf('?') ? "&mode=" : "?mode=") + mode + "&lang=" + lang;
window.location.replace(url);
}
function backToMain(){
var url = "https://mobile.bet9ja.com/Mobile";
window.location.replace(url);
}
</script>
<script type="text/javascript" src="js/grapi.js"></script>
</head>
<body>
<div class="container" id="product" style="display: none">
</div>
<div class="container" id="playarea" style="">
<script>
var isLoaded = false;
function onLoadIframe(iframe) {
if (!isLoaded) {
// iframe.src = '?game=league&OTP=905f9407-8b82-4cf6-9d63-f7bf7fe4da6c&mode=premier&lang='; // './index-iframe-content.html' + window.location.search;
if( iframe.src != "" )
{
isLoaded = true;
}
}
else
{
goBackUrl();
}
}
eventMethod = window.addEventListener ? "addEventListener" : "attachEvent";
eventer = window[eventMethod];
messageEvent = eventMethod == "attachEvent" ? "onmessage" : "message";
eventer(messageEvent, function (e) {
let data = e.data.split('$');
let command = data[0];
if (command == "goHome") {
backToMain();
}
}, false);
</script>
<div style="${bet9ja.iframe.style}">
<iframe id="playAreaFrame" onload="onLoadIframe(this)" style="
position:absolute;top:0;left:0;right:0;bottom:0;width:100%;height:100%;border:0;
" src="https://vsmobile.bet9ja.com/mobile-1.94.35/themes/?sk=bet9ja&t=644ee448-8fb1-426c-9922-31688a0a85f6&pinHash=02ba41004b38f08bf291e763d02ec2b0&pid=14001&v=0&text=Premier&homeUrl=https://mobile.bet9ja.com/Mobile&otp=905f9407-8b82-4cf6-9d63-f7bf7fe4da6c&ss=&bl=&vu=0">
</iframe>
</div>
</div>
<script type="text/javascript" charset="utf-8">
$(function() {
var input = {"game":"league","OTP":"905f9407-8b82-4cf6-9d63-f7bf7fe4da6c","mode":"premier","lang":""};
var u = "905f9407-8b82-4cf6-9d63-f7bf7fe4da6c";
var home = ""; //"https://vsmobile.bet9ja.com/bet9ja-mobile/login/";
var params = "&pid=14001&v=0&text=Premier";
var game = "league_premier";
grapi.loggedUser(u,input,home,params,game,true );
});
</script>
<script type="text/javascript">window.NREUM||(NREUM={});NREUM.info={"beacon":"bam.nr-data.net","licenseKey":"c95cd51526","applicationID":"214311961","transactionName":"ZlBXZxcAVkEHV0NbDV8aYEEMTlpXEg1dU09cWldaCQQXXglTXlxNWFtRVh1PSFoW","queueTime":0,"applicationTime":5,"atts":"ShdUEV8aRU8=","errorBeacon":"bam.nr-data.net","agent":""}</script>
</body></html>
But what happens in the website, is another page will load after this one, which contains the information and numbers that I need, and when I inspect the page using Chrome I find an other html in side the previous one (this one is the one I need):
<html lang="en" class="ui-mobile"><head><base href="https://vsmobile.bet9ja.com/mobile-1.94.35/themes/?sk=bet9ja&t=644ee448-8fb1-426c-9922-31688a0a85f6&pinHash=02ba41004b38f08bf291e763d02ec2b0&pid=14001&v=0&text=Premier&homeUrl=https://mobile.bet9ja.com/Mobile&otp=905f9407-8b82-4cf6-9d63-f7bf7fe4da6c&ss=&bl=&vu=0#bet"><meta http-equiv="Content-Type" content="text/html; charset=utf-8"><title></title><link rel="stylesheet" href="../plugins/font-awesome/css/font-awesome.min.css"><meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1.0, user-scalable=0"><link rel="stylesheet" href="../plugins/jquery-mobile/css/jquery.mobile-1.4.4.css"><link rel="stylesheet" href="../fonts/Icomoon/icomoon.css"><script type="text/javascript" async="" src="https://d31qbv1cthcecs.cloudfront.net/atrk.js"></script><script type="text/javascript" src="../plugins/jquery-mobile/jquery-1.11.1.min.js"></script><script type="text/javascript" src="../plugins/jquery-mobile/jquery.mobile-1.4.4.min.js"></script><script type="text/javascript" src="../plugins/md5/md5.min.js"></script><script type="text/javascript" src="../plugins/ejs/ejstpl.js"></script><script type="text/javascript" src="_base/views/views.min.1.94.35.js"></script><script type="text/javascript" src="../js/lib.min.1.94.35.js"></script><script type="text/javascript" src="bet9ja/js/tracking.js"></script><script async="" src="//static.hotjar.com/c/hotjar-243625.js?sv=5"></script><script type="text/javascript" src="bet9ja/js/certify.js"></script><link id="dynamic-favicon" rel="shortcut icon" href="bet9ja/assets/favicon.ico"><link rel="stylesheet" type="text/css" href="bet9ja/css/style.min.1.94.35.css"></head><body class="ui-mobile-viewport ui-overlay-a" style="padding-top: 0px;"><div class="panel left ui-panel ui-panel-position-left ui-panel-display-push ui-panel-closed ui-body-inherit ui-panel-animate" data-role="panel" data-position="left" data-display="push" id="menu_left_panel">
<div class="ui-panel-inner"><div class="panel-container">
<div id="playlist-selector"></div>
<div class="menu-container">
<div id="deposit-now-container">
Deposit now
</div>
<div id="deposit-now-container-min">
<div class="deposit-now-service-container">
<img class="payment-img" src="_base/assets/img/mpesa_GR.png">
<div class="payment-text">Paybill Number</div>
<div class="pay-bill">997270</div>
</div>
<div class="deposit-now-service-container">
<img class="payment-img" src="_base/assets/img/airtel_GR.png">
<div class="payment-text">Paybill Name</div>
<div class="pay-bill">997270</div>
</div>
</div>
<div id="menu-logged-information"><table><tbody><tr> <td style="font-weight: bold;color:#7792B5; text-shadow: none">Logged: </td> <td id="nom_log" style="padding-left:20px;font-size:1.5em">3942938</td> </tr><tr> <td style="font-weight: bold;color:#7792B5">Balance: </td> <td style="padding-left:20px;font-weight: bold;color:#FFD326"><span id="current_balance">₦ 0</span></td> </tr> </tbody></table></div>
<ul id="menu"><li class="li_live"></li><li class="li_live"></li><li class="li_live"></li><li class="li_live"></li><li class="li_live"></li><li class="li_live"></li><li class="li_live"></li><li class="li_live"></li><li class="li_live"></li><li class="li_live"></li><li class="li_live"></li>
<li class="li_bet"><a style="padding-left: 20px" id="a_bet_bet" onclick="ViewInit.betButton()" title="Bets" data-rel="close" class="ui-link"><i class="fa fa-chevron icon-home3"> </i>Bet now</a></li>
<li class="li_ticket"><a style="padding-left: 20px" id="a_bet_ticket" onclick="ViewTicketHistory.showTicketHistory(false)" title="Tickets" data-rel="close" class="ui-link"><div id="circle-menu-ticket-id"></div><i class="fa fa-chevron icon-ticket"> </i><span>Tickets </span></a></li>
<li class="li_results"><a style="padding-left: 20px" id="a_bet_results" onclick="ViewResults.showResults()" title="Results" data-rel="close" class="ui-link"><i class="fa fa-chevron icon-trophy"> </i>Results</a></li>
<li class="li_league_table"><a style="padding-left: 20px" id="a_league_table" onclick="ViewLeagueTable.showLeagueTable()" title="League Table" data-rel="close" class="ui-link"><i class="fa fa-chevron icon-calendar"> </i>League Table</a></li>
<!--<li class="li_statment"><a id="a_bet_statment" onclick="$.mobile.pageContainer.pagecontainer('change', '#statements')" title="Statements" data-rel="close">Statements<i class="fa fa-chevron"></i></a></li>-->
<li class="li_back"><a style="padding-left: 20px" id="a_bet_bet" onclick="ViewMenu.close()" title="Bets" data-rel="close" class="ui-link"><i class="fa fa-chevron icon-arrow-left2"> </i>Close menu</a></li>
<li class="li_back"><a style="padding-left: 20px" id="a_bet_bet" onclick="/*window.history.back()*/ window.parent.postMessage('goHome', '*'/*window.location.origin*/);" title="Bets" data-rel="close" class="ui-link">Mobile Home</a></li>
</ul>
<div id="last-session-div"></div>
</div>
</div></div>
</div><div id="loading" style="display: none;"><div id="loading-league">
<div id="loading-div-image">
<img id="loading-image-bar" src="bet9ja/assets/img/intro_loader.gif">
</div>
<div id="loading-div-error"></div>
</div>
</div><div id="bet" class="demo-wrapper ui-page ui-page-theme-a ui-page-active" data-role="page" data-url="bet" tabindex="0" style="position: relative;"><div class="ui-panel-wrapper"><div class="header ui-header ui-bar-inherit" data-role="header" role="banner">
<span class="open left"><i class="fa fa-bars icon-menu" style="font-size: 1.4em; line-height: 2em"></i></span>
<span class="title title-header-mobile"><img class="log-image-header" src="bet9ja/assets/img/logo_1_gl.png" alt="logo">
</span>
<!-- BetSlip -->
<span id="liveBetsTicket">
<a id="bet_ticket" onclick="document.getElementById('div_button_market').scrollIntoView(true);" title="Tickets" class="ui-link">
<i class="fa-lg fa-chevron-right pull-right icon-ticket"></i><span id="bet_ticket_matchResult_counterSelections">0</span>
</a>
</span>
<!-- FreeBets -->
<div id="freeBets">
<a id="freeBetsButton" title="Free bets" class="ui-link">
<div class="icon-free-bets pull-right"></div>
<span id="free_bets_counterSelections">0</span>
</a>
<div id="freeBetsDropdown" class="dropdown" style="display: none;">
<div id="freeBetsDropdownActive" class="active-free-bets"><a class="free-bet no-items">
<span>No available free bets</span>
</a></div>
<div id="freeBetsDropdownInactive" class="inactive-free-bets"></div>
</div>
</div>
</div><div class="content ui-content" data-role="content" style="position: relative;" role="main">
<div class="titan-content" style="display:none">
<div class="div-xs-6 titan-group-container">
<div class="gold-titan-text">Gold Titan</div>
<div class="gold-titan-amount"></div>
</div>
<div class="div-xs-6 titan-shop-container">
<div class="titan-text">Red Titan</div>
<div class="titan-amount"></div>
</div>
</div>
<div class="bets-bonus">
<div class="div-xs-5 bonus-text">Bonus<span>Level: 1</span></div>
<div class="div-xs-1 div-empty"> </div>
<div class="div-xs-5 bonus-amount bonus-collapse">₦ 100</div>
<div class="div-xs-1 bonus-collapse"> <i class="fafa fa-chevron-up" aria-hidden="true"></i></div>
</div>
<div class="bets-bonus-collapsed collapsed">
<div class="div-xs-3 bonus-text">Bonus</div>
<div class="div-xs-1 percentage-bar-bonus-collapsed">0%</div>
<div class="div-xs-4 bonus-amount-collapsed">₦ 100</div>
<div class="div-xs-3 countdown-time-bonus-collapsed bonus-collapse">48h 0' 0''</div>
<div class="div-xs-1 bonus-collapse"> <i class="fafa fa-chevron-down" aria-hidden="true"></i></div>
</div>
<div class="bets-bonus-extended">
<div class="countdown-bar-bonus">
<div class="div-xs-12 countdown-bonus">
<div class="countdown-bonus-inside" style="width: 0%;"> </div>
<div class="circle-percentage" style="left: 0%;">0%</div>
</div>
</div>
<div class="time-bonus">
<div class="countdown-time-bonus">48h 0' 0''</div>
</div>
<div class="text-bonus">
<div class="div-xs-1 div-empty"> </div>
<div class="div-xs-10 bonus-message" style="display: block">
Each ticket you place within the above time gets you closer to your free bonus. Once you claim your bonus your level moves up and your bonus gets higher<i class="info-bonus-hover fafa fa-info" aria-hidden="true" style="margin-left: 5px;border-radius: 5px;"></i></div>
<div class="div-xs-10 bonus-message-winner" style=" display: none;"></div>
<div class="div-xs-1 div-empty"> </div>
</div>
</div>
<div id="bets-time" style="display: block;" class=""><div class="playlist-info">
<img class="playlist-image" height="50" width="50" src="bet9ja/assets/premier.png" alt="14001">
<div id="bets-time-betContdown">00:34</div>
<div>
<span id="text-idleague">League</span>
#<span id="idleague">5269</span>
<span id="leagueWeek">Week <span id="leagueWeekNumber">03</span></span>
</div>
</div>
<div class="credit-with-countdown">
<div id="credit-countdown">₦ 0</div>
</div></div>
<div id="loading-next-event">
<p>Waiting next round<br>
<img src="bet9ja/assets/img/loader_data_race.gif">
</p>
</div>
...ect The code stills too long
I have tried this code:
premiere_legue.click() #this button takes as to page where the problem is
time.sleep(15)
html = driver.execute_script("return document.getElementsByTagName('html')[0].innerHTML")
print(html) # The output is the same first code I shared
I believe that this has to go through a JavaScript code,
Any one can help with this please?
Looks Like the page might be rendered. This solution recommends waiting to retrieve the contents of the page How to get html with javascript rendered sourcecode by using selenium
from time import sleep # this should go at the top of the file
sleep(5)
html = driver.execute_script("return document.getElementsByTagName('html')[0].innerHTML")
How do have my page fill the username and password on an external site?
I am trying to make an HTML page, that when users access, it will take them to a 3rd party external site (I have no control over), and fill in the username and password fields, and log them in.
This is the source of the external site, which I got from my browser.
<!DOCTYPE html>
<html><head>
<title>Omitted | Login</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<script type="text/javascript">
var areActiveModsSelected = false;
var areInactiveModsSelected = false;
function SetActiveSelection()
{
var checkboxes = document.ActiveMods.getElementsByClassName("ModSelection");
areActiveModsSelected = !areActiveModsSelected;
SetSelection(checkboxes, areActiveModsSelected);
}
function SetInactiveSelection()
{
var checkboxes = document.InactiveMods.getElementsByClassName("ModSelection");
areInactiveModsSelected = !areInactiveModsSelected;
SetSelection(checkboxes, areInactiveModsSelected);
}
function SetSelection(checkboxes, isSelected)
{
for(var i=0, n=checkboxes.length;i<n;i++)
{
checkboxes[i].checked = isSelected;
}
}
function checkSavegame()
{
var e = document.getElementById("savegame");
if (e != null) {
var savegame = e.options[e.selectedIndex].text;
var isEmpty = isEmptySavegame(savegame);
document.getElementById("mapSelector").disabled = !isEmpty;
document.getElementById("difficultySelector").disabled = !isEmpty;
}
}
function isEmptySavegame(value)
{
var ret = value.match(/SAVEGAME \d\d* - Empty/g) || value.match(/SPIELSTAND \d\d* - Leer/g) || value.match(/SAUVEGARDE \d\d* - Vide/g);
return ret != null;
}
window.onload = function()
{
checkSavegame();
}
</script>
<link rel="stylesheet" type="text/css" href="css/main.css" />
<link rel="stylesheet" type="text/css" href="css/monitor.css" />
<link rel="shortcut icon" href="favicon.ico" type="image/x-icon" />
<link rel="icon" href="favicon.ico" type="image/x-icon" />
<script type="text/javascript" src="js/all.js"></script>
</head>
<body>
<div class="white-bg clearfix">
<header class="main-header" role="banner" data-module="sticky">
<div class="header-bar clearfix"> <div class = "row column"> <div class = "top-bar-right"> <ul class = "menu float-left"><li><a target="_newTwitter" href="https://twitter.com/url"><span class="icon icon-twitter"></span></a></li><li><a target="_newFacebook" href="https://www.facebook.com/giants.farming.simulator"><span class="icon icon-facebook"></span></a></li><li><a target="_newYoutube" href="http://www.youtube.com/user/giantssoftware"><span class="icon icon-youtube"></span></a></li><li><a target="_newGoogleolus" href="https://plus.google.com/109211762279175256996"><span class="icon icon-google"></span></a></li> </ul>
<ul class="dropdown menu float-right"><li class="is-dropdown-submenu-parent is-down-arrow menu-flags"><img src="img/icons/flag-en.png" alt="lang"><ul class="menu submenu is-dropdown-submenu first-sub vertical"><li><img style="border:1px solid #000;" src="img/icons/flag-en.png" alt="English"><span class="country">English</span> <span>(en)</span></li><li><img style="border:1px solid #000;" src="img/icons/flag-de.png" alt="Deutsch"><span class="country">Deutsch</span> <span>(de)</span></li><li><img style="border:1px solid #000;" src="img/icons/flag-fr.png" alt="Francais"><span class="country">Francais</span> <span>(fr)</span></li></ul></li></ul> </div>
</div>
</div>
<div class="top-bar"> <div class="row column"> <div class="top-bar-left"> <img src="img/logo.png"> </div> <div class="top-bar-right"> <ul class="menu float-left"> <li><span>HOME</span></li>
<li><span>SAVEGAMES</span></li>
<li><span>MODS</span></li>
<li><span>JOURNAL</span></li>
<li><div class="status-indicator online"><span>ONLINE</span></div></li></ul></div></div></div></header><section class="content-wrap"><div class="row"> <div class="medium-8 columns">
<img src="template/gsfs.png"><br/><br/><h2>Login to server</h2>
<p>Please enter your login credentials</p>
<div class="row column">
<form name="input" action="index.html?lang=en" method="POST"><div class="table2"><div class="row column table-even"><div class="medium-3 columns column-label">Username</div><div class="medium-9 columns"><input type="text" name="username" value=""></div></div><div class="row column table-odd"><div class="medium-3 columns column-label">Password</div><div class="medium-9 columns"><input type="password" name="password" value=""></div></div><div class="row column table-even text-right">
<input class="button button-form-submit" name="login" type="submit" value="Login"></div></div></form><br />
<h2>Dedicated Server Mobile App (Free)</h2><div><a class="itunesbadge" href="https://itunes.apple.com/WebObjects/MZStore.woa/wa/viewSoftware?id=1135922781&mt=8" style="display:inline-block;overflow:hidden;background:url(https://linkmaker.itunes.apple.com/images/badges/en-us/badge_appstore-lrg.svg) no-repeat;width:135px;height:40px;background-position: center;"></a><a class="googleplaybadge" href="https://play.google.com/store/apps/details?id=com.giantssoftware.fs17_dedi_app" style="margin-left: 5px; display:inline-block;overflow:hidden;background:url(https://play.google.com/intl/en_us/badges/images/apps/en-play-badge-border.png) no-repeat;width:141px;height:40px;background-size: cover;background-position-x: -4px;background-position-y: -3px;"></a></div></div>
</div>
<div class="medium-4 columns">
<div class="social-wrapper">
<div class="social-header clearfix">
<div class="title-wrap clearfix" style="line-height: 62px;">
<i class="icon icon-twitter"></i><span>Twitter</span>
</div>
Follow
</div>
<!-- Load from cache: ../cached/fs17_dedi_twitter_cache_farmingsim_4.json-->
<div class="social-news-block">
<p>RT hi: Come and meet us at E3 at booth West Hall #4512 to learn more about Farming Simulator 19, the next game in the successf…</p>
<span class="post-date">about 1 hour ago</span>
</div>
<div class="social-news-block">
<p>Are you are bale stacking champion? Are you at #blank ? Then show us your skills. The… <a target="_blank" href="blank">nothing</a></p>
<span class="post-date">4 days ago</span>
</div>
<div class="social-news-block">
<span class="post-date">11 days ago</span>
</div>
<div class="social-news-block">
<p>RT #url: We are glad to announce our plans for further expansion by moving to bigger office spaces for our two existing studios…</p>
<span class="post-date">12 days ago</span>
</div>
</div>
</div>
</div>
</section>
<div class="partners clearfix text-center"> <div class="row"> <div class="columns">
<img style="vertical-align:text-top;" src="template/image_11.gif" /> </div> </div> </div> <footer class="main-footer clearfix">
<div class="row">
<div class="medium-8 columns">
<div class="copyright"><img class="copyright__logo" src="img/logos/footer-logo.png"><div>© 2016 GIANTS Software GmbH Alle Rechte vorbehalten.<br>Alle anderen Warenzeichen sind das Eigentum ihrer jeweiligen Besitzer.</div></div> </div>
<div class="medium-4 small-12 columns">
<ul class="menu menu-footer float-right">
<li>7.0.5.0</li>
</ul>
</div>
</div>
</footer>
<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/frontend.js"></script>
<script>$(document).foundation();</script>
</div>
</body>
</html>
I tried this, but it simply redirects to the page without filling any of the fields.
<DOCTYPE html>
<html>
<head>
<title>TEST</title>
<script>
window.onload = function() {
document.getElementById('loginForm').submit();
};
</script>
</head>
<body>
<form id="loginForm" action="URL of site" method="POST">
<input type=hidden name="username" value="moo"/>
<input type=hidden name="password" value="boo"/>
</form>
</body>
</html>
What is wrong with my code, and how can I achieve my goal?
Thank you.
How to trigger function on data-toggle with Bootstrap Twitter?
Hello everyone I have list of items in one of the screens. Once user clicks on the item I want to hide that item show the other div container and trigger the function. Here is working example of what I have so far:
function appToggle() {
var codeVal = $(this).data(code);
console.log(codeVal);
}
<html lang="en">
<head>
<title>My Application</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<script language="javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script language="javascript" src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<script src="Bootstrap/Bootstrap_Confirmation/bootstrap-confirmation.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
</head>
<body>
<div id="main-container" class="container">
<div id="master_list" class="collapse in">
<fieldset>
<legend>Application</legend>
<div class="list-group">
<a href="#" class="list-group-item" data-toggle="collapse" data-target="#master_list,#master_table">
<span data-code="APP_USERS" class="glyphicon glyphicon-list"></span> Application Users
</a>
<a href="#" class="list-group-item" data-toggle="collapse" data-target="#master_list,#master_table">
<span data-code="APP_POS" class="glyphicon glyphicon-list"></span> Application Positions
</a>
</div>
</fieldset>
</div>
<div id="master_table" class="collapse">
<div class="row">
<div class="form-group col-xs-12 col-sm-12 col-md-12 col-lg-12">
<button type="button" class="btn btn-primary" data-toggle="collapse" data-target="#master_table,#master_list">
<span class="glyphicon glyphicon-plus-sign"></span> Go Back
</button>
</div>
</div>
Test Show/Hide container
</div>
</div>
</body>
</html>
As you can see in example above if user clicks on any item in the list new container will show and list will go off the screen. I would like once they click to trigger appToggle() function that will get code value for the current element. Is there a way to trigger this function automatically without setting function as inline element? If anyone know the way to achieve this please let me know.
Did you try doing that function as an onclick listener? e.g.
$('a.list-group-item').click(function() {
var codeVal = $(this).children('span').data('code');
console.log(codeVal);
});
<html lang="en">
<head>
<title>My Application</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<script language="javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script language="javascript" src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<script src="Bootstrap/Bootstrap_Confirmation/bootstrap-confirmation.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
</head>
<body>
<div id="main-container" class="container">
<div id="master_list" class="collapse in">
<fieldset>
<legend>Application</legend>
<div class="list-group">
<a href="#" class="list-group-item" data-toggle="collapse" data-target="#master_list,#master_table">
<span data-code="APP_USERS" class="glyphicon glyphicon-list"></span> Application Users
</a>
<a href="#" class="list-group-item" data-toggle="collapse" data-target="#master_list,#master_table">
<span data-code="APP_POS" class="glyphicon glyphicon-list"></span> Application Positions
</a>
</div>
</fieldset>
</div>
<div id="master_table" class="collapse">
<div class="row">
<div class="form-group col-xs-12 col-sm-12 col-md-12 col-lg-12">
<button type="button" class="btn btn-primary" data-toggle="collapse" data-target="#master_table,#master_list">
<span class="glyphicon glyphicon-plus-sign"></span> Go Back
</button>
</div>
</div>
Test Show/Hide container
</div>
</div>
</body>
</html>