How to create a Web slice with Search? - ie8-webslice

Does anyone know how bing's weather webslice search works? I am attempting to create a web slice(only available in IE8) with search built in and I have read that forms are not allowed and neither is javascript. Any help would be appreciated.

You can create active content by defining it on another page using the entry-content rel attribute of an tag. In this example slice.aspx has JavaScript code on it.
<div class="hslice" id="MySlice">
<p class="entry-title">
My Active Slice</p>
<a rel="entry-content" href="slice.aspx" />
<div class="entry-content">
</div>
</div>

You can achieve a similar effect using some simple javascript in a Chrome extension to create an Arbitrary Web Slice extension but with the advantage of being able to take any slice out of any web page, not just predefined Web Slice areas like Bing weather. Obviously only works in Chrome but Firefox has a similar extension API in GreaseMonkey.

Related

UI Automation - Elements on my UI have ember ids , which change frequently with addition of new UI elements. How to use the id for automation?

Example of the HTML of a dropdown element:
<div aria-owns="ember-basic-dropdown-content-ember1234" tabindex="0" data-ebd-id="ember1234-trigger" role="button" id="ember1235" class="ember-power-select-trigger ember-basic-dropdown-trigger ember-view"> <!---->
<span class="ember-power-select-status-icon"></span>
</div>
The xpath and CSS selector also contain the same ember id.
xpath : //*[#id="ember1235"]
css selector : #ember1235
The ember id would change from id="ember1235" to say, id="ember1265" when there is a change in the UI.
I am using id to locate the element. But every time it changes I need to modify the code. Is there any other attribute I could use for Ember JS UI elements?
There is quite a lot to discuss in your question but hopefully we will have a good answer for you #PriyaK
The first thing to mention is that Ember IDs may not be the best method to select an element in the DOM. As you have already mentioned, they can change from time to time and also it doesn't really give you a great semantic thing to select in your selenium test so it might seem a bit out of context when looking back.
One thing that you could try is to either pass a class to the ember-power-select component (the one that provides the HTML that you used in your example) and use that to select the element, something like:
<PowerSelect
#class="my-fancy-class"
as |name|
>
{{name}}
</PowerSelect>
Then you should be able to select the selected value by using the CSS selector .my-fancy-class span (because the component outputs the selected value in a span)
We just tried this in an example app but it didn't actually work 🤔 Never fear, you can also do something like this and it should work with the same selector as before:
<div class="my-fancy-class">
<PowerSelect as |name|>
{{name}}
</PowerSelect>
</div>
This is fine, but there are also a few issues using classes for selectors in tests. One example of a problem that might crop up is that your tests might all suddenly stop working if you did a style refactor and changed or removed some of the classes on your elements. One technique that has become popular in the Ember community is to use data-test- attributes on your DOM nodes like this:
<div data-test-my-fancy-select>
<PowerSelect
#class="my-fancy-class"
as |name|
>
{{name}}
</PowerSelect>
</div>
which can then be accessed by the following selector: [data-test-my-fancy-select] span. This is great for a few reasons! Firstly it separates the implementation of your application and tests from your styling and avoids the issue I described above. The second benefit of this method is that using what #Gokul suggested in the comments, the ember-test-selectors package, you can make use of these data-test- selectors in your development and test environments but they will be automatically removed from your production build. This is great to keep your DOM clean in production but also, depending on the size of your application, could save you a reasonable amount of size in your templates on aggregate.
I know you say that you are using selenium for your testing but it's also worth mentioning that if you're using the built-in Ember testing system you will be able to make use of some testing helpers that addons may provide you. ember-power-select is one of those addons that provides specific testing helpers and you can read more about it in their documentation: https://ember-power-select.com/docs/test-helpers
I hope this answers any questions you had!
This question was answered as part of "May I Ask a Question" Season 3 Episode 1. If you would like to see us discuss this answer in full you can check out the video here: https://www.youtube.com/watch?v=1DAJXUucnQU

I want to use t method for href of a tag and custom data attribute instead of nuxt-link when using Nuxt.js + i18n

Dynamic multilingual sites from the backend to the replacement of large sites
I changed the language, but this time I am trying for the first time to do it at the front desk (Nuxt.js + i18n).
<a href="https://gooogle/en.com" data-link="fugafuga">
Without using nuxt-link
<template>
<a href="https://gooogle/{{t('locale')}}.com" data-link="{{t('hogehoge')}}" >
</template>
Is it possible to divert and use a tag as it is?
(In the above writing method, an error occurred and it was useless, so please teach me a workaround)
I18n t method wrapped in quotes in inside tag quote
How do I write it?
Such a shape is desirable because the scale is too large
We apologize for the inconvenience, but we would appreciate it if you could teach us.
thank you.
Suggested fix:
<template>
<a :href="`https://google/${t('locale')}.com`" :data-link="t('hogehoge')"></a>
</template>
You can read more about data binding with Vue/Nuxt here: https://v2.vuejs.org/v2/guide/class-and-style.html#Object-Syntax

How to get fully qualified url with selenium on a link without any href attribute?

I would like to retrieve url from a link on an html page.
unfortunately, html code does not contain any href attribute (I suppose it is managed by some javascript code)
Here is html code :
<p class="ng-scope">
<a class="documentLink ng-binding" data-document-id="21928499">Electronic document</a>
</p>
I tried to do it with getattribute() function :
By linkPodPopover = new ByXpath("//div[#class='popover-content']//a[contains(.,'Electronic document')]");
find(linkPodPopover).getAttribute("href");
but it returns an empty String...
I also tried with this code but also without success :
driver.getCurrentUrl()
click(linkPodPopover)
Do you see another way ?
I did not find any answer on the internet.
And I tried to explore every javascript attribute of the DOM element of my link without finding URL.
Finally, I came across this problem by using browserstack functionnalities : http://browserstack.com/automate/java#enhancements-uploads-downloads
It allows to click on the download link, then the browser download it. then using Javascript, I can check if file is well downloaded, and if size and md5 are correct. –

Hide poi.business markers/labels in Google Static Maps API

I'm building a static Google Map URL to be used within <noscript><noscript> tag on a 'Find Us' page as fall-back in case a user has scripting turned off. Code thus far is:
<div id="map" class="map">
<noscript>
<img src="https://maps.googleapis.com/maps/api/staticmap?center=[lat],[long]
&zoom=17
&size=600x400
&scale=1
&maptype=hybrid
&visible=[lat],[long]
&key=[key hidden]">
</noscript>
</div>
However, on the resulting map image, there are markers for other businesses (e.g. orange knife & fork markers for restaurants) and/or points of interest.
I want to suppress the display of these markers, and add a custom marker for my location of interest (&markers=.... not shown in the code snippet above).
I cannot find anything in the Static Maps API documentation, nor on stackoverflow.
Is there a way to achieve this, or am I stuck with them on a Static Map?
Tack this on your query string:
style=feature:poi|visibility:off
You can find other stylings here.

Can I build my html with dynamic Schema.org markup?

I have a page for Mobile application details and features, but the app itself is not implemented yet and not available on any store, so I don't know the size,version,rating etc..
The question is can I render the page with dynamic Schema.org markup, which means to build now for example as an Article markup, and once the app is live the page will be built with MobileApplication ? Can I do this and Google will like it and understand it? if not, what can I do for my case?
#if(IsAppLive){
<div itemscope itemtype="http://schema.org/MobileApplication">
}
else{
<div itemscope itemtype="http://schema.org/Article">
}
Yes, but Google will only scrape and index one version. It won't register a second version until it re-scrapes, which can take up to two weeks.