I want to get image urls by scraping data by cheerio from a slider but can able to do this tried a lot but can found a solution here is my code below
const retURL = a.find('.gallery-carousel').find('img').attr('src')
.map(function(){
let image= $(this).attr('src');
console.log(image, 'nnnnknknkn')
})
const retURL = $('div.carousel').attr('img')
const retURL = $('gallery-carousel__image-touchable').text()
var listItems = $(".gallery-carousel ul li");
listItems.each(function(idx, li) {
let image= $(li).find('img').attr('src');
console.log(image);
// and the rest of your code
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.0/jquery.min.js"></script>
<div class="gallery-carousel">
<ul>
<li class="slide selected">
<button><img src="https://i.stack.imgur.com/rC97H.png" alt="hello" /> </button>
</li>
<li class="slide">
<button><img src="https://i.stack.imgur.com/1.png" alt="hello" /> </button>
</li>
<li class="slide">
<button><img src="https://i.stack.imgur.com/2.png" alt="hello" /> </button>
</li>
</ul>
</div>
Related
I just need the focus to stay once the element is clicked. I can't get it to work. This code below is from my masterpage. The hover works ok, but after clicking one of the menu options, it does not stay focused and goes right back to the home button. Can someone possibly shed some light on why this isn't working?
<body>
<script type="text/javascript" src="wz_tooltip.js"></script>
<form id="form1" runat="server">
<br />
<br />
<center>
<!-- start header -->
<header>
<div class="container">
<div class="navbar navbar-static-top">
<div class="navigation">
<nav>
<ul class="nav topnav bold" >
<li class="dropdown active">
<a id="nav1" href="../default.aspx" runat="server">HOME </a>
</li>
<li class="dropdown">
<a id="nav2" href="../reverse_mortgages.aspx" runat="server" onclick="setNavagation();">REVERSE MORTGAGE FAQ</a>
</li>
<li class="dropdown">
<a id="nav3" href="../loan_process.aspx" runat="server">OUR PROCESS</a>
</li>
<li id="nav4" class="dropdown">
GET QUOTE
</li>
<li id="nav5" class="dropdown">
ABOUT
</li>
<li id="nav6" class="dropdown">
CONTACT
</li>
</ul>
</nav>
</div>
<!-- end navigation -->
</div>
</div>
</header>
</center>
<script type="text/javascript">
function setNavigation() {
var path = window.location.pathname;
path = path.replace(/\/$/, "");
path = decodeURIComponent(path);
if (path.substring(1, path.length) === "") { // this was the home page loading already active
return;
}
$("li.active").removeClass("active"); // remove class 'active' all list items
$(".navigation a").each(function () {
var href = $(this).attr('href');
if (path.substring(1, path.length) === href) {
$(this).parent('li').addClass('active');
return;
}
});
}
</script>
<!-- end header -->
I am new to react and I task is to remove the Jwt token from local storage when the user log out. I have tried on many methods but I failed to do so. Anyone can help? Thanks in advance :)
The code below is my code
my navbar code:
const Sidebar = ({auth: {isAuthenticated}},logoutUser) => {
const authlinks=(
<ul>
<li>
<Link to="/profiles">Developers</Link>
</li>
<li>
<Link to="/posts">Posts</Link>
</li>
<li>
<Link to="/dashboard">
<i className="fas fa-user" />{' '}
<span className="hide-sm">Dashboard</span>
</Link>
</li>
<li>
<Link to ="/home">
<a onClick={logoutUser}>
<i className="fas fa-sign-out-alt" />{' '}
<span className="hide-sm">Logout</span>
</a>
</Link>
</li>
</ul>
);
const guestLinks = (
<ul>
<li>
<Link to="/profiles">Developers</Link>
</li>
<li>
<Link to="/register">Register</Link>
</li>
<li>
<Link to="/login">Login</Link>
</li>
</ul>
);
return (
<Navbar bg="dark" expand="lg" variant="dark">
<Fragment>{isAuthenticated ? authlinks :
guestLinks}</Fragment>
</Navbar>
);
};
Sidebar.propTypes={
logoutUser: propTypes.func.isRequired,
auth: propTypes.object.isRequired
}
const mapStateToProps = (state)=>({
auth: state.auth
});
export default connect(mapStateToProps, {logoutUser})
(withRouter(Sidebar));
the code below is my remove token function:
this function is to remove the token from the local storage
export const logoutUser = () => dispatch => {
localStorage.removeItem("jwtToken");
setAuthToken(false);
dispatch(setCurrentUser({}));
}
Importantly, your Sidebar component should only take one argument (props) but right now you have it taking two arguments. You can fix this by fixing how you destructure the props:
const Sidebar = ({auth: {isAuthenticated},logoutUser}) => {
// logoutUser should work now
}
I'm writing an react project, and I want to require imgs src dynamically in jsx render, just like this:
return (
<li className="grid">
<a href={category.url}>
<div className="image-wrapper">
<img className="logo" src={require(category.imgSrc)}/> // !!here
</div>
<span className="title">{category.name}</span>
</a>
</li>
)
//category.imgSrc is like "../../images/01_taxi.png"
however, I got the error:
Uncaught Error: Cannot find module '../../../01_shunfengche.png'.
so, I try the require.context like this
var requireContext = require.context("../../../images/",false,/\.png$/);
var imgsrc = requireContext("01_taxi.png");
return (
<li className="grid">
<a href={category.url}>
<div className="image-wrapper">
<img className="logo" src={imgsrc}/>
</div>
<span className="title">{category.name}</span>
</a>
</li>
)
it still doesn't work, can anyone help me ?
finally,i tried this:
var requireContext = require.context("../../../images",false,/\.png$/);
var that = this;
var lis = this.props.data.map(function(category,index){
var imgsrc = requireContext("./"+category.img); //here!
return (
<li className="grid" data-value={category}>
<a href={category.url}>
<div className="image-wrapper">
<img className="logo" src={imgsrc}/>
</div>
<span className="title">{category.zh_name}</span>
</a>
</li>
)
});
write the correct path really does matter.
The exception
"{"Unable to locate element: {\"method\":\"xpath\",\"selector\":\"// > div[#class='item-content'][3]\"}"}"
The code
public static void Main ()
{
Login_FAM lgn = new Login_FAM();
Demat_Acount prg = new Demat_Acount();
lgn.Login();
prg.DematAdd();
}
// login.cs file //
public FirefoxDriver driver ;
public Login_FAM()
{
driver = new FirefoxDriver();
}
public void Login()
{
driver.Url = "http://180.211.114.147:97//Account/Login";
var usernameF = driver.FindElementById("UserName");
var passwdF = driver.FindElementById("Password");
var loginB = driver.FindElementById("btnLogin");
usernameF.SendKeys("harsh");
passwdF.SendKeys("harsh123");
loginB.Submit();
// Thread.Sleep(3000);
}
//demat_acount.cs file //
public FirefoxDriver driver;
public Demat_Acount()
{
driver = new FirefoxDriver();
}
public void DematAdd()
{
IWebElement pro = driver.FindElement(By.XPath("// div[#class='item-content'][3]"));
pro.Click();
if(pro != null)
{
pro.Click();
}
}
below is my HTML Code
<ul class="main-navigation-menu ng-scope" ng-controller="menuctrl">
<li ui-sref-active="active" class="active">
<a ui-sref="app.dashboard" href="#/app/dashboard">
<div class="item-content" style="padding-right:10px;padding-top:5px">
<div class="item-media">
<i style="font-size:20px" class="icon-Dashboard"></i>
</div>
<div class="item-inner">
<span class="title ng-scope">Dashboard</span>
</div>
</div>
</a>
</li>
<li ui-sref-active="active">
<a ui-sref="app.familydashboard" href="#/app/FamilyDashboard">
<div class="item-content" style="padding-right:10px;padding-top:5px">
<div class="item-media">
<i style="font-size:20px" class="icon-FamilyDashboard"></i>
</div>
<div class="item-inner">
<span class="title ng-scope">Family Dashboard</span>
</div>
</div>
</a>
</li>
<li ui-sref-active="active" class="open">
<a href="javascript:void(0)">`enter code here`
<div class="item-content" style="padding-right: 10px; padding-top: 5px">
<div class="item-media">
<i style="font-size:20px" class="icon-Profile2"></i>
</div>
<div class="item-inner">
<span class="title"> Profile </span>
<i class="icon-arrow" style="margin-top: 3px"></i>
</div>
</div>
</a>
<ul class="sub-menu" style="display: block;">
<li>
<li>
<a ui-sref="app.demataccount" href="#/app/DematAccount">Demat Account</a>
</li>
<li>
<a ui-sref="app.familyassociation"href="#/app/FamilyMemberAssociation">Family Association</a>
</li>
</ul>
</li>
</ul>
And FYI i have executed same code without creating methods and objects and that is working but crating method and objects it doesn't working
WebDriver could not find the element as your element is embedded in another div tag. Make sure your XPath is correct. Validate it using firepath. I'm new to automation, if I get this error, I'll verify my XPath.
Try changing XPath to
// div[#class='item-content'][3]/div/i
I'm not sure whether this might solve your problem or not, but trying to help. Make sure the element exists or put a wait until the element is visible.
I'm using node.js and flatiron plates for templating, and having trouble with scrambled output when using an array for data.
I would like to bind an array to list items with the ID "list"
JS:
var express = require('express');
var app = express.createServer();
var fs = require('fs');
var plates = require('plates');
var html = fs.readFileSync('plates.html', 'utf-8');
app.get('/', function(req, res) {
var data = {
list: [
"Alpha",
"Bravo",
"Charlie",
"Delta",
]
}
res.send(plates.bind(html, data))
})
app.listen(8080)
HTML:
<html>
<body>
<ul>
<li id="list">REPLACE</li>
</ul>
<div>
<h3>Hello World</h3>
<p>Click the following button.</p>
<span>Go Back</span>
</div>
</body>
</html>
I would expect the output to look like this, where only the list items are repeated:
<body>
<ul>
<li id="list">Alpha</li>
<li id="list">Bravo</li>
<li id="list">Charlie</li>
<li id="list">Delta</li>
</ul>
<div>
<h3>Hello World</h3>
<p>Click the following button.</p>
<span>Go Back</span>
</div>
</body>
</html>
However, I get this weird output and can't understand what the cause might be:
<html>
<body>
<ul>
<li id="list">Alpha</li>
</ul>
<div>
<h3>Hello World</h3>
<p>Clic<li id="list">Bravo</li>
</ul>
<div>
<h3>Hello World</h3>
<p>Clic<li id="list">Charlie</li>
</ul>
<div>
<h3>Hello World</h3>
<p>Clic<li id="list">Delta</li>
</ul>
<div>
<h3>Hello World</h3>
<p>Clic
</ul>
<div>
<h3>Hello World</h3>
<p>Click the following button.</p>
<span>Go Back</span>
</div>
</body>
</html>
Any ideas?
(P.S. I know HTML doesn't allow for repeated IDs, it's just an example and not the issue)
Updated Information
I ran the tests that pksankara pointed out successfully, but if I modify the tests to use my markup, I get failures:
Modified test-16.html:
<ul>
<li class="components"></li>
</ul>
<div>
<h3>Hello World</h3>
<p>Click the following button.</p>
<span>Go Back</span>
</div>
Output:
<ul>
<li class="components">Union</li>
</ul>
<div>
<h3>Hello World</h3>
<p>Clic<li class="components">Director</li>
</ul>
<div>
<h3>Hello World</h3>
<p>Clic<li class="components">Broadway</li>
</ul>
<div>
<h3>Hello World</h3>
<p>Clic<li class="components">Plates</li>
</ul>
<div>
<h3>Hello World</h3>
<p>Clic<li class="components">Resourceful</li>
</ul>
<div>
<h3>Hello World</h3>
<p>Clic
</ul>
<div>
<h3>Hello World</h3>
<p>Click the following button.</p>
<span>Go Back</span>
</div>
The following is an example on how to do this from the plates repository
Plates Bind: https://github.com/flatiron/plates/blob/master/test/api-test.js#L172
JSON: https://github.com/flatiron/plates/blob/master/test/fixtures/test-16.json
HTML: https://github.com/flatiron/plates/blob/master/test/fixtures/test-16.html
OUTPUT: https://github.com/flatiron/plates/blob/master/test/fixtures/test-16.out
I expect that you can imitate it.
(EDIT: The only bug is https://github.com/flatiron/plates/issues/47)