translate pipe inside v-html directive i18 vue with vuex - vue.js

I'm using vuex-i18n package. Basically I'm translating most of my content by filter pipe like so:
{{ header | translate }}
but sometimes I need to translate text which in fact is just html and I bind it like so:
<p v-html="paragraph"></p>
but this doesn't work with pipe:
<p v-html="paragraph | translate"></p> // display ()
paragraph in above example is:
<p class="balears__text">Jest największym miastem Majorki, kosmopolityczną stolicą Balearów i prężniedziałającym, śródziemnomorskim ośrodkiem turystycznym.</p><p class="balears__text"> Katedra La Seu to zdecydowanie najsłynniejsza budowla Palmy. Ta gotycka świątynia z elementami architektury zaprojektowanej przez słynnego Gaudiego stanowi wizytówkę miasta i jest symbolem całej wyspy. </p><p class="balears__text"> Nieopodal katedry znajduje się pałac królewski La Almudaina. Spacer po komnatach i dziedzińcu sprawi, że poczujesz się, jakbyś wędrował po tych zabudowaniach w czasach ich świetności. </p><p class="balears__text"> Doskonałym pomysłem na rodzinne popołudnie jest wizyta w jednym z największych kompleksów akwariowych na świecie. W Palma Aquarium możesz przeżyć niesamowitą przygodę, nurkując z rekinami w najgłębszym zbiorniku w Europie, tzw. Big Blue. </p>

I found solution like so:
<p v-html="$options.filters.translate(paragraph)"></p>

Related

Data scraping by selenium p tag

I searched a lot on the internet. I couldn't find an example similar to the one below. I'm trying to pull text from a web page. There is no location line in the first p tag. The second location section has a location line. When pulling data, I can only pull the contents of the p tag, which is the location row. I cannot pull the contents of the other p tag. I wonder how can I pull the data inside the first and second p tag?
HTML codes of Page Source:
<div class=" col-md-8">
<p>
<i class='fa fa-home main-color'></i> ORHAN MAH.İBRAHİM CAD. NO:35
<br>
<i class='fa fa-phone main-color'></i>
<a class="gri" href="tel:0508-2920344">0508-2920344 </a>
<br />
<i class='fa fa-clock-o main-color'></i>
<span class="red">19.01.2022</span>
</p>
<p>
<i class='fa fa-home main-color'></i> HAZAN MAH.ÖKTEM CAD. NO:13/B
<br>
<i class='fa fa-phone main-color'></i>
<a class="gri" href="tel:0584 837 23 70">0584 837 23 70 </a>
<br>
<i class="fa fa-map-marker main-color"></i>
<a class="gri" href="https://www.google.com/maps?q=35.554433,25.887766" target="_blank">Haritada</a>
<br />
<i class='fa fa-clock-o main-color'></i>
<span class="red">20.01.2022</span>
</p>
</div>
Here is the selenium code I used to pull the data from the HTML source above:
item = browser.find_elements_by_class_name("col-md-10")
urls = browser.find_elements_by_xpath("//div[#class=' col-md-10']/p/a[2]")
for i in zip(item,urls):
try:
address = i[0].find_element_by_css_selector("p").text.split("\n")[:2]
except:
address = None
try:
phone = i[0].find_element_by_xpath("//a[#class='gri'][1]").text
except:
phone = None
print(address)
print(phone)
try:
url = i[1].get_attribute('href').replace("https://www.google.com/maps?q=","")
except:
url = None
try:
date = i[0].find_element_by_xpath("//span[#class='red'][1]").text
except:
date = None
print(url)
print(date)
Use xpath //div[#class=' col-md-8']/p. This will return data of both p tags.
Then you can perform string operations as per your requirement and use data of each p tag using for loop
The 1.p tag blog has no location section. The 2.p tag blog has a location section. In the 1.p tag I want, I want to print none instead of the location in the p blog. When I try to pull with zip_longest regularly the location fails to pull.
#1.p tag block
ORHAN MAH.İBRAHİM CAD. NO:35
0508-2920344
19.01.2022
#2.p tag block
HAZAN MAH.ÖKTEM CAD. NO:13/B
0584 837 23 70
Haritada
20.01.2022

Scrape text under div tag that is in quotes

Trying to scrape this part: "Lounge, Showers, Lockers"
https://i.stack.imgur.com/k5mzg.png
<div class="CourseAbout-otherFacilities more">
<h3 class="CourseAbout-otherFacilities-title">Available Facilities</h3> " Lounge, Showers, Lockers "
</div>
Website:
https://www.golfadvisor.com/courses/16929-black-at-bethpage-state-park-golf-course
response.css('.CourseAbout-foodAndBeverage.more::text').get() command returns " \n "
Thank you
There are three text elements in your target div (matched by your CSS expression):
<div class="CourseAbout-otherFacilities more">FIRST<h3
<h3 class="CourseAbout-otherFacilities-title">SECOND</h3>
</h3>THIRD</div>
By using .get() you're telling Scrapy to return first match.
I recommend to use XPath expression here instead and match your element by text:
//h3[.="Available Facilities"]/following-sibling::text()[1]'

how to insert a new empty line on selected index number in an array using \n. while we loop through it using v-for and create a list

want to insert a new empty line before a selected array element while we loop through it using v-for to create a list..trying to do this using \n isn't working
<!-- this is the template part -->
<ul>
<li v-for = "ninja in ninjas" > {{ninja}}</li>
</ul>
/* this is the script part notice index no 2 in the array*/
data() {
return {
ninjas: [
'mati kahe kumhaar sey, tu kya ronday mohey',
' Ik din aisa aayega mai rondungi tohe',
'\n aaye hain toh jaayengay Raja, Rank, fkeer',
' Ik sinhaasan chodi chale, Ik baandhay zanjeer'
]
};
},
This is pretty easy to do using the <pre> tag which forces it to preserve white space, new lines, etc. This is often used for preserving formatting in code examples.
<div id="app">
<ul>
<li v-for = "ninja in ninjas" ><pre>{{ninja}}</pre></li>
</ul>
</div>
working example: https://jsfiddle.net/skribe/10yL6va8/8/
You will probably want to use css to style the text surrounded by <pre> since most browsers automatically format it differently.

selenium ide extract text from input tag [value attribute]

I am using selenium IDE for writing test case and I am trying to extract content in value attribute of below tag
<div id="inputcontainer_f-5" class="FGIC" style="max-width:none;"><input type="text" autocomplete="off" name="f-5" id="f-5" class="dummyclass FastEvtFieldFocus" value="TEXT_I_WANT_TO_GET" readonly="readonly" spellcheck="true" tabindex="-1" style="">
</div>
My selenium IDE code
comment | Target | value
store text | xpath=//input[#id='f-3'] | EXTRATCED_CONTENT
echo | ${EXTRATCED_CONTENT}
Result : I am getting empty string
echo : ""
If i try to change the xpath as xpath=//input[#id='f-3']/#value I am getting following error
storeText on xpath=//input[#id='f-5']/#value with value EXTRATCED_CONTENT Failed:
The result of the xpath expression "//input[#id='f-5']/#value" is: [object Attr]. It should be an element.
How do i extract and store TEXT_I_WANT_TO_GET in variable EXTRATCED_CONTENT and echo it
Thanks
Jk
Try this below.
//input[#id='f-3']#value

How to select specific text to scrape

I'm trying to scrape the following HTML, I want just to get the Some Header part and not the additional info.
<li class="media">
<div class="media-body">
<h4> Some Header <span class="label label-info"> additional Info </span> </h4> Address info
<br>
</div> </li>`
I'm trying the following:
val li: Elements = ul.select("li")
val list: Elements = li.select("a")
val headers: Elements = list.select("h4")
`
and then when I try to get the inner text via, headers.text() I'm getting both Some Header and additional Info
How can I only scrape the Some Header part?
You are almost near to the solution .You are probably looking for calling ownText:
String s = "<li class=\"media\"> \n" +
" <div class=\"media-body\"> \n" +
" <h4> Some Header <span class=\"label label-info\"> additional Info </span> </h4> Address info\n" +
" <br> \n" +
" </div> </li>";
Document document = Jsoup.parse(s);
Elements element = document.select("li");
Elements elements = element.select("a");
System.out.println(elements.select("h4").first().ownText()); ;
Output:
Some Header