Collapsible "open" example doesn't work

[nick-janda]

There doesn't seem to be a way to "open" the first header of a "basic use" collapsible component. The example in the demo for the "basic use" implies this is possible, but it is non-functional in the demo and there is no documentation for how to do this.

In my scenario, I am databinding the headers using a repeat.for. I want the first header to be opened initially by default.

[MaximBalaganskiy]

Please see this gist https://gist.run/?id=eb33096dcf98a386bf3c77172d6cc061

[nick-janda]

Thank you, but what I'm trying to do is have the first header opened by default. Your example requires clicking a button, which does work. I tried to do it in the attached() event of app.ts but this.collapsible.instance is undefined at that point (and so cannot call open()). What are my options?

example in app.ts:

attached(){
  this.collapsible.open();  //Throws error: Cannot read property of 'open' on undefined.
      //this.collapsible.instance is undefined
}

[MaximBalaganskiy]

I've updated the gist to cater for your case. What happens is collapsible's attached is called after page's attached, so there is no instance yet. Using a TaskQueue solves the issue by delaying the action for the next cycle.