How to use the ember-classy-page-object.collection function in ember-classy-page-object

import BaseAddonPage from './base';
import { collection } from 'ember-classy-page-object';

const GuidePage = BaseAddonPage.extend({
  navItems: collection({ scope: '[data-test-id="nav-item"]' }),

  // eslint-disable-next-line ember/avoid-leaking-state-in-ember-objects
  index: {
    scope: '[data-test-current-page-index]',

    items: collection({
      scope: '[data-test-index-item]'
    })
  }
});

export default GuidePage.create();

scope: '[data-test-toggle]'
  }),

  sections: collection({
    scope: '[data-test-api-section]',

    header: text('[data-test-section-header]'),

    items: collection({
      scope: '[data-test-item]',

      header: text('[data-test-item-header]'),
      importPath: text('[data-test-import-path]'),
      description: text('[data-test-item-description]'),

      params: collection({
        scope: '[data-test-item-params] [data-test-item-param]'
      })
    })
  }),

  // eslint-disable-next-line ember/avoid-leaking-state-in-ember-objects
  editLink: {
    scope: '[data-test-edit-page-link]',
    href: attribute('href', 'a'),
  },

  // eslint-disable-next-line ember/avoid-leaking-state-in-ember-objects
  index: {
    scope: '[data-test-page-index]',

    items: collection({

import BaseAddonPage from './base';
import { collection } from 'ember-classy-page-object';

const GuidePage = BaseAddonPage.extend({
  navItems: collection({ scope: '[data-test-id="nav-item"]' }),

  // eslint-disable-next-line ember/avoid-leaking-state-in-ember-objects
  index: {
    scope: '[data-test-current-page-index]',

    items: collection({
      scope: '[data-test-index-item]'
    })
  }
});

export default GuidePage.create();

import BaseAddonPage from '../base';
import { collection, text } from 'ember-classy-page-object';

const ClassPage = BaseAddonPage.extend({
  navItems: collection({ scope: '[data-test-id="nav-item"]' }),

  title: text('[data-test-class-name]'),
  description: text('[data-test-class-description]'),

  sections: collection({
    scope: '[data-test-api-section]',

    header: text('[data-test-section-header]'),

    items: collection({
      scope: '[data-test-item]',

      header: text('[data-test-item-header]'),
      importPath: text('[data-test-import-path]'),
      description: text('[data-test-item-description]'),

import BaseAddonPage from '../base';
import { collection, text } from 'ember-classy-page-object';

const ClassPage = BaseAddonPage.extend({
  navItems: collection({ scope: '[data-test-id="nav-item"]' }),

  title: text('[data-test-class-name]'),
  description: text('[data-test-class-description]'),

  sections: collection({
    scope: '[data-test-api-section]',

    header: text('[data-test-section-header]'),

    items: collection({
      scope: '[data-test-item]',

      header: text('[data-test-item-header]'),
      importPath: text('[data-test-import-path]'),
      description: text('[data-test-item-description]'),

      params: collection({
        scope: '[data-test-item-params] [data-test-item-param]'
      })
    })
  })
});

export default new ClassPage();

title: text('[data-test-class-name]'),
  description: text('[data-test-class-description]'),

  sections: collection({
    scope: '[data-test-api-section]',

    header: text('[data-test-section-header]'),

    items: collection({
      scope: '[data-test-item]',

      header: text('[data-test-item-header]'),
      importPath: text('[data-test-import-path]'),
      description: text('[data-test-item-description]'),

      params: collection({
        scope: '[data-test-item-params] [data-test-item-param]'
      })
    })
  })
});

export default new ClassPage();

import BaseAddonPage from '../base';
import { attribute, collection, text } from 'ember-classy-page-object';

const ModulePage = BaseAddonPage.extend({
  navItems: collection({ scope: '[data-test-id="nav-item"]' }),

  toggles: collection({
    scope: '[data-test-toggle]'
  }),

  sections: collection({
    scope: '[data-test-api-section]',

    header: text('[data-test-section-header]'),

    items: collection({
      scope: '[data-test-item]',

      header: text('[data-test-item-header]'),
      importPath: text('[data-test-import-path]'),
      description: text('[data-test-item-description]'),

      params: collection({

isSortable: hasClass('is-sortable'),

  sort: SortPage,
  sortIndicator: alias('sort.indicator'),
  sortToggle: alias('sort.toggle'),

  resizeHandle: ResizePage,
});

export default {
  scope: 'thead',

  /**
   * List of columns in the header.
   */
  headers: collection('th', Header),

  /**
    Returns the number of rows in the footer.
  */
  get rowCount() {
    return Number(findElement(this).getAttribute('data-test-row-count'));
  },

  rows: collection({
    scope: 'tr',
  }),
};

import BaseAddonPage from '../base';
import { collection, text } from 'ember-classy-page-object';

const ClassPage = BaseAddonPage.extend({
  navItems: collection({ scope: '[data-test-id="nav-item"]' }),

  title: text('[data-test-class-name]'),
  description: text('[data-test-class-description]'),

  sections: collection({
    scope: '[data-test-api-section]',

    header: text('[data-test-section-header]'),

    items: collection({
      scope: '[data-test-item]',

      header: text('[data-test-item-header]'),
      importPath: text('[data-test-import-path]'),
      description: text('[data-test-item-description]'),

      params: collection({
        scope: '[data-test-item-params] [data-test-item-param]'
      })
    })
  })

import { collection } from 'ember-classy-page-object';
import EmberTableBody from './ember-table-body';

export default EmberTableBody.extend({
  scope: 'tfoot',

  footers: collection({
    scope: 'td',
  }),
});