We Keep Coding

How to get stripe element in cypress

I want to write end-to-end tests for web-application on Ionic with stripe-payments and have problem to type card number in stripe iframe field.
I checked Testing Stripe Elements with Cypress to understand how to do this stuff, but it doesn't work.
I have this structure of my HTML:
Screenshot of my structure:
Can you have any idea how to do this?

The cypress-plugin-stripe-elements plugin should work:
This plugin provides a fillElementsInput that makes it easy to fill out Stripe Elements inputs without cy.wait() hacks or anything else.
cy.fillElementsInput('cardNumber', '4242424242424242');

for an card number we could use cy.fillElementsInput('cardNumber', cardNum);
for an example if we want to use within a page object
getIBANNumberText(cardNum){
return cy.get('.StripeElement').within(() => {
cy.fillElementsInput('cardNumber', cardNum);
});
}
in this example cardNum is the parameter to get the input into the Stripe Element.

How to append an HTML tag which contains attributes in angular 8

I started to learn Angular recently and I just started to code a project which contains some articles.
Articles are passed from backend completely. (a thing like it)
<p onclick="function" name="itsName" data-info="data">text</p>
its tags and all attributes are saved in DB exactly like the mentioned example.
Now I am looking to show this data through angular.
[innerHTML] is the common way everyone uses. but it does not render tag's attributes. so my code is not working!
this.content="<div><h2 class='textAlignCenter' (click)='hello()' name='thisis' >"+id+"</h2><div>";
But it shows a thing like it after render :
<div><h2 class='textAlignCenter'>"+id+"</h2><div>
but I am looking to get a result like it.
<div><h2 class='textAlignCenter' (click)='hello()' name='thisis' >changed content - >333</h2><div>

Protractor hard to click popup/dropdown

Hey guys I am trying to click on an element called practitioner access on my company's web site and I have tried looking up documentation on stack over flow and have not figured out how to do this exactly I need help. What I am trying to do is click on the practitioner access popup/drop down and I have not been able to find the code to do it. Please see epic at the bottom:
This is how far I have gotten so far but protractor cant find the element
var pracaccess = element(by.xpath("//contains(#onclick, 'Practitioner Access')"))
pracaccess.click();
browser.sleep(10000);
I have tried to use these site to try and help myself but I can't piece it together. Any help would be appreciated. I am new to xpath as well.
new info to possibly help:
Here is a more expanded view
Also this is what it looks like in vb-script but its basically the same any suggestions?
Browser("ADP_2").Page("ADP_3").Link("html tag:=A","innertext:=Practitioner Access").WaitProperty "visible",True,30000
Browser("ADP_2").Page("ADP_3").Link("html tag:=A","innertext:=Practitioner Access").Object.Click

This XPath expression would look for a tag with the contains tag name, which does not exist. Instead, you've actually meant:
//a[contains(#onclick, 'Practitioner Access')]
Or, there is a nicer way to locate an a element by the link text:
element(by.linkText("Practitioner Access"))

The answer by alecxe is correct but if you want it to be as xpath:
element(by.xpath('//a[text()="Practitioner Access"]'));

Angular 4, use html without Component backing

I'm using Angular 4, and as of now my application follows the following pattern with
something.component.ts
something.component.html
something.component.css
However, I would like to have a raw html ("legal.html") file and reference it in the "something.component.html" view but I'm not sure about where to even start or what question to ask.
"legal.html" will also have to be bind to the parent controller too (something.component.ts).
Any help on getting something like this to work:
legal.html
<div>Hello</div>
something.component.html
<div>
I'm something
<legal>
</div>
is greatly appreciated.

What you are looking for is component.
You can simple create a new component using following command
ng g component legal
Then in legat.component.html file write your html then in your other html file you can simply refer to your code using selector tag
This link may be helpful
Angular component

Angular with ng-flow : existing flow object

Might be a silly question but I couldn't figure the solution out myself or google it. I'm using a button for click+upload files. However, I also want to add the drag+drop functionality the same time - using preferably the same flow object and function. Here's my current code:
<div flow-init flow-name="uploader.flow" flow-files-submitted="uploadFiles()"
flow-file-success="fileUploaded()">
<label for="file-upload" class="upload">Files</label>
<input id="file-upload" type="file" flow-btn>
So I'd like to use the 'uploader.flow' scope for my drag and drop too executing 'uploadFiles()' with it on submit. Here's what I've been trying:
<div flow-init flow-object="...??..." flow-drop
flow-files-submitted="uploadFiles()" flow-file-success="fileUploaded()" ></div>
I believe myself the issue is only that I can't figure out what to put in flow-object. But I doubt it was that simple. Might be something also with the new init? Should it be done or not.
Another way around of course could be to find the first shared parent element and init it there instead for both the same time? But would this be a bit too vague?

So in the end I did what I didn't originally want to do. I went up the parent elements until I found a common one the both were children of and did the initialization for ng-flow there instead.
It works.