-1

Edit: Thank you so much for all the effort, got all my code running now!

I want to trigger a click on https://shop.adidas.ae/en/stan-smith-shoes/S82255.html (to make a shoe bot). Why does this code not work to trigger the size type button?

setTimeout(function () {
   $('select.product-type.js-size-type').trigger('click');
}, 1000);

This is the select button:

<select class="product-type js-size-type">

This is what chrome console says

caught TypeError: Cannot read property 'click' of null
    at <anonymous>:2:41

Updated:

My manifest of the chrome extension:

{
  "name": "name",
  "description": "test",
  "version": "1.0",
  "manifest_version": 2,
  "permissions": ["*://*/*"],
  "content_scripts": [
    {
      "matches": ["*://*.adidas.ae/*"],
      "js": ["jquery.js", "yeezyCopper.js"]
    }
  ],
  "background": {
    "scripts": ["background.js"],
    "persistent": false
  }
}

YeezyCopper.js :

setTimeout(function () {
   $('select.product-type.js-size-type').trigger('click');
}, 1000);

Thanks in advance!

Noah
  • 661
  • 1
  • 8
  • 17
  • 1
    try to put it in on ready: `$(function(){ $('select.product-type.js-size-type').trigger('click'); })` – Adam Wolski Feb 21 '17 at 13:37
  • 1000 may be insufficient. Use a bigger timeout or MutationObserver to watch for the elements. [Is there a JavaScript/jQuery DOM change listener?](//stackoverflow.com/a/39508954) – wOxxOm Feb 21 '17 at 13:53
  • Adam, your code does literally nothing, so no error code from the console... – Noah Feb 21 '17 at 14:02
  • wOxxOm, I dont think the timeout should be a probably since the page is already loaded when typing into the console. Let me have a look at the MutationObserver... – Noah Feb 21 '17 at 14:05
  • Do you put your code in a `script` element? In that case `$` will be used from the page script, which is not jQuery but PrototypeJS. – wOxxOm Feb 21 '17 at 14:14
  • I use it in a chrome extension in a javascript file. – Noah Feb 21 '17 at 14:17
  • 1
    If you're asking about a chrome extension, you pretty much must post the manifest.json file, and tell us which js file has the code you're showing us. But trim it down to a [mcve] first. – Teepeemm Feb 21 '17 at 14:56
  • @Teepeemm Updated my question and trimmed it down. I dont think it has anything to do with the extension though. Thanks for the effort. – Noah Feb 21 '17 at 15:24
  • My thought is that it could be the same problem as [this answer](http://stackoverflow.com/a/28399358/2336725) (ignore the question). Can you trigger the change event using regular javascript? – Teepeemm Feb 21 '17 at 16:40
  • `function eventFire(el, etype){ if (el.fireEvent) { el.fireEvent('on' + etype); } else { var evObj = document.createEvent('Events'); evObj.initEvent(etype, true, false); el.dispatchEvent(evObj); } } eventFire(document.getElementById('product-type js-size-type'), 'click');` – Noah Feb 21 '17 at 17:23
  • @Teepeemm So this is what I found after a quick search and I get this error: `Uncaught TypeError: Cannot read property 'fireEvent' of null at eventFire (yeezyCopper.js:2) at yeezyCopper.js:10 eventFire @ yeezyCopper.js:2 (anonymous) @ yeezyCopper.js:10` – Noah Feb 21 '17 at 17:24
  • However, I read that it should work in console which it does not for me... – Noah Feb 21 '17 at 17:26
  • Just realized I forgot to change to getelementbyclassname. I'm gonna try again tomorrow. – Noah Feb 21 '17 at 18:43

2 Answers2

2

The code works properly, but the "click" event triggered programmatically will not open the select option list.

See Is it possible to use JS to open an HTML select to show its option list?

You can test that it works by adding your own onclick event for that element and then triggering the click event.

Community
  • 1
  • 1
Iván Nokonoko
  • 4,888
  • 2
  • 19
  • 27
-3

Update

setTimeout(function () {
   $('select.product-type.js-size-type').trigger('click');
}, 1000);

with

setTimeout(function () {
   $('select .product-type.js-size-type').trigger('click');
}, 1000);
j08691
  • 204,283
  • 31
  • 260
  • 272
Rakesh Yadav
  • 113
  • 7
  • does not work and i do not know why it should. My code works on other web pages as well... – Noah Feb 21 '17 at 13:42
  • Ahh, I missed earlier, you need to put space in between type and JS – Rakesh Yadav Feb 21 '17 at 13:56
  • setTimeout(function () { $('.select.product-type .js-size-type').trigger('click'); }, 1000); – Rakesh Yadav Feb 21 '17 at 13:56
  • This is one element, so shouldnt I exchange all the spaces with dots? Thanks for the help – Noah Feb 21 '17 at 14:09
  • No, in your example, there are two classes "product-type" and "js-size-type", that's why you should use "." to start class name, and space as usual. make sense ?? – Rakesh Yadav Feb 21 '17 at 14:15
  • Ok i get what you mean but it still does not change anything. – Noah Feb 21 '17 at 14:20
  • Are you still getting same error ? If yes, can you share complete block of code to look into ? – Rakesh Yadav Feb 21 '17 at 14:26
  • Yes its still the same error. This is basically the only thing I wanna do right now (actually I want to be able to click on a specific size but doesnt matter if I cant click on this element). I have manifest for the chrome extension, the javascript file and of course jquery file. However, I am trying to get this code to work in the chrome console at the moment. Thanks again – Noah Feb 21 '17 at 14:31
  • setTimeout(function () { $('.size-dropdown-block .ffSelectButton').trigger('click'); }, 1000) – Noah Feb 21 '17 at 14:34
  • This code works for http://www.adidas.com/us/ultraboost-uncaged-shoes/BA7997.html adidas us with no problem – Noah Feb 21 '17 at 14:35
  • @RakeshYadav You've not formatted your code, so it's hard to tell what you mean. But changing `select` to `.select` would miss the element in question, because it would go from looking for a `select` tag to looking for a `select` class, which isn't present. – Teepeemm Feb 21 '17 at 14:54
  • You've still not properly formatted your code (it also doesn't help that you don't explain what change you're recommending). But changing `select.product-type` to `select .product-type` (with a space) will again miss the element because it will look for a `product-type` class *within* the `select` tag, which doesn't exist. – Teepeemm Feb 21 '17 at 19:06