I have a client that uses EmberJS on their website. When I want to inject a value to one of the text input fields with elem.value="##", it changes the text inside the field, but does not update the variables that are sent to the server. It seems like there is an event listener on the <body> tag that does it. Is there a way to dispatch an event on the <body> element with some other element as the target?
dimanche 20 février 2022
Dispatch event on body tag with another element as the target
vendredi 18 février 2022
Variable/Changing ember number in Intercom HTML. Selenium Python
I am trying to automate some tasks at work. Requests wont work because I don't have admin access to my works Intercom App. Therefore I use Selenium.
I want to write "Hey" in the chat box of Intercom, and send the message.
** The problem is a changing ember number every time I have a new conversation. It works when I copy the right ember number every time, but when changing the conversation, it doesn't work anymore. **
I am looking for some kind of script to change the ember = XXXXX into the right number each time
Not really relevant to the code problem, but I am using Chrome in debugging mode, to avoid logging in every time I need to test the code, and I am using tkinter to have a button to press, every time I want to write "Hey" in the chat box.
Sorry, I understand it is difficult to replicate this problem.
from selenium import webdriver
from selenium.webdriver.chrome.options import Options
#___________
#In order to run Selenium in an already opened browser / session, I need to run this code in CMD:
#cd C:\Program Files (x86)\Google\Chrome\Application
#
#chrome.exe --remote-debugging-port=9222 --user-data-dir="C:\Users\peter\testprogram"
#___________
opt=Options()
opt.add_experimental_option("debuggerAddress","localhost:9222")
driver=webdriver.Chrome(executable_path="
C:\\ProgramFiles\\crromedriver\\chromedriver.exe",options=opt)
def hey():
ember = 32890
hey = driver.find_element_by_xpath('//*[@id="ember'+str(ember)+'"]/div/div[3]/div[1]/div/p')
hey.send_keys("Hey!")
The specific HTML element where I want to write "Hey!": (This is under the big HTML code below)
<p class="intercom-interblocks-align-left embercom-prosemirror-composer-block-selected" style="">Hey! This is where I want my text</p>
One might suggest to use
hey = driver.find_element_by_class_name('intercom-interblocks-align-left embercom-prosemirror-composer-block-selected')
hey.send_keys("Hey!")
But this doesn't work for me.
The HTML element where the ember number is changing:
<div id="ember32890" class="u__relative inbox__conversation-composer__wrapper ember-view"><div>
<div></div>
<div>
</div>
<div data-test-prosemirror-composer="" class="composer-inbox composer-style-basic o__fit conversation__text embercom-prosemirror-composer ">
<style>
.ProseMirror {
outline: none;
white-space: pre-wrap;
}
.ProseMirror .intercom-interblocks-html-block {
white-space: normal;
}
li.ProseMirror-selectednode {
outline: none;
}
.ProseMirror-selectednode.embercom-prosemirror-composer-image img,
.ProseMirror-selectednode.embercom-prosemirror-composer-video iframe,
.ProseMirror-selectednode.embercom-prosemirror-composer-messenger-card
.intercom-interblocks-messenger-card,
.ProseMirror-selectednode.embercom-prosemirror-composer-html-block,
.ProseMirror-selectednode.embercom-prosemirror-composer-button .intercom-h2b-button {
outline: 2px solid #8cf;
}
hr.ProseMirror-selectednode,
.embercom-prosemirror-composer-template.ProseMirror-selectednode,
.embercom-prosemirror-composer-mention.ProseMirror-selectednode {
outline: 1px solid #8cf;
}
</style>
<div>
<!----><div contenteditable="true" role="textbox" dir="auto" data-insertable="true" class="ProseMirror embercom-prosemirror-composer-editor dir-auto"><p class="intercom-interblocks-align-left embercom-prosemirror-composer-block-selected" style="">Hey!Hey!Hey!Hey!Hey!</p><p class="intercom-interblocks-align-left" style=""><br></p></div></div>
<div class="flex flex-row flex-wrap gap-4 embercom-prosemirror-composer-attachment-list">
<!----></div>
<!---->
<!---->
<!---->
<!---->
<!---->
<div></div>
<!---->
<!----></div>
<!---->
<!----></div></div>
jeudi 17 février 2022
POST request on form submit ember.js
I am totally green in Ember.JS. I’ve made simple adoption shelter application with Ember tutorials as I am using ember on front end, and Strapi (Node.JS) as an Headless CMS. I have all the endpoints and my ember front is successfully fetching data with GET method via JavaScript’s fetch. However, I want to allow users to create POST requests based on form submit, I can’t find any good example or tutorial how to properly make an post request on form submit in ember.js, could you please help me with figuring out how to do this?
mardi 15 février 2022
Will an ember.js application that pulls its content from an API be properly indexed in Google?
I'm thinking of moving my company's static site to an ember.js page that will pull text and images from an API (specifically strapi).
The most pressing issue I have before starting this project is: Will the site still be properly indexed in search engines?
Ember.js, like other single page frameworks, only delivers a very slim HTML shim on first load, and then pulls or generates its content dynamically in JS. I've been trying to find a definitive answer, but so far to no avail, wether google will correctly index the content of pages.
If not built-in, will a plug-in like fastboot help in delivering the content properly to crawlers?
mardi 8 février 2022
Emberjs - How to map api json response to a model?
While trying to build an Ember.js sample application, to call a REST Api and display results. I was able to call, fetch and display the results. In the component I am reading through the json response results.
How can I map the response data to a pre-defined model and use that in the component instead? I could not find relevant docs at https://guides.emberjs.com/release/models/defining-models/ or https://guides.emberjs.com/release/in-depth-topics/making-api-requests/#toc_where-to-make-api-requests
Code details:
- Using this sample API https://reqres.in/api/users
- Route:
export default class UsersRoute extends Route {
async model() {
let response = await fetch('https://reqres.in/api/users');
let data = await response.json();
return data.data;
}
}
- Template:
<UserList
@title="List of Users"
@users=
/>
- Component:
<tr>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
samedi 5 février 2022
Ember 4.1. Django rest json api. Access field choices from OPTIONS request in Ember data model or elsewhere
My DRF JSON API backend responds with a JSON on OPTIONS request. The OPTIONS response includes field choices declared on Django model. On my frontend, in my Ember 4.1 app with default JSONApiAdapter I want to use these exact same choices on my form select. Is there a way to access these choices on my Ember model or somewhere else? and if so, How do I do it? Here's an example OPTIONS response:
{
"data": {
"name": "Names List",
"description": "API endpoint for Names",
"renders": [
"application/vnd.api+json",
"text/html"
],
"parses": [
"application/vnd.api+json",
"application/x-www-form-urlencoded",
"multipart/form-data"
],
"allowed_methods": [
"GET",
"POST",
"HEAD",
"OPTIONS"
],
"actions": {
"POST": {
"name": {
"type": "String",
"required": true,
"read_only": false,
"write_only": false,
"label": "Name",
"help_text": "name",
"max_length": 255
},
"name-type": {
"type": "Choice",
"required": true,
"read_only": false,
"write_only": false,
"label": "Name type",
"help_text": "Name type",
"choices": [
{
"value": "S",
"display_name": "Short"
},
{
"value": "L",
"display_name": "
]
}
}
}
}
}
vendredi 4 février 2022
How can I resolve a TypeError using old version of ember and ember-light-table?
I have the test project at https://github.com/ericg-ember-questions/test_computed_sort
I setup the project by doing the following:
Node version: v12.18.1 (npm v6.14.5)
- npm install --save-dev ember-cli@3.4
- ./node_modules/.bin/ember new test_computed_sort
- cd test_computed_sort/
- ./node_modules/.bin/ember install ember-light-table@1.13.2
- ./node_modules/.bin/ember generate component test-comp
- ./node_modules/.bin/ember serve
Hello
If I comment out the reference to light-table, no error is generated. However, with it, I see in the console:
media.js:15 Uncaught TypeError: decorator is not a function
at media.js:15:1
at Array.reduce (<anonymous>)
at _applyDecoratedDescriptor (media.js:15:1)
at Module.callback (media.js:240:1)
at Module.exports (loader.js:106:1)
at Module._reify (loader.js:143:1)
at Module.reify (loader.js:130:1)
at Module.exports (loader.js:104:1)
at requireModule (loader.js:27:1)
at Class._extractDefaultExport (index.js:432:1)
What can I do to resolve this error so I can use ember-light-table with this project?