Fix expand active order in ReviewChapters

src/js/helpers.js

@@ -523,6 +523,22 @@ export function expandArrayPages(pageList, data) {
   return result.currentList;
 }
 
+/**
+ * Gets active and expanded pages, in the correct order
+ *
+ * Any `showPagePerItem` pages are expanded to create items for each array item.
+ * We update the `path` for each of those pages to replace `:index` with the current item index.
+ *
+ * @param pages {Array<Object>} List of page configs
+ * @param data {Object} Current form data
+ * @returns {Array<Object>} A list of pages, includeing individual array
+ *   pages that are active
+ */
+export function getActiveExpandedPages(pages, data) {
+  const expandedPages = expandArrayPages(pages, data);
+  return getActivePages(expandedPages, data);
+}
+
 /**
  * getPageKeys returns a list of keys for the currently active pages
  *
@@ -532,8 +548,7 @@ export function expandArrayPages(pageList, data) {
  *   and the index if it’s a pagePerItem page
  */
 export function getPageKeys(pages, formData) {
-  const eligiblePageList = getActivePages(pages, formData);
-  const expandedPageList = expandArrayPages(eligiblePageList, formData);
+  const expandedPageList = getActiveExpandedPages(pages, formData);
 
   return expandedPageList.map(page => {
     let pageKey = page.pageKey;
@@ -554,8 +569,7 @@ export function getPageKeys(pages, formData) {
 export function getActiveChapters(formConfig, formData) {
   const formPages = createFormPageList(formConfig);
   const pageList = createPageList(formConfig, formPages);
-  const eligiblePageList = getActivePages(pageList, formData);
-  const expandedPageList = expandArrayPages(eligiblePageList, formData);
+  const expandedPageList = getActiveExpandedPages(pageList, formData);
 
   return _.uniq(expandedPageList.map(p => p.chapterKey).filter(key => !!key && key !== 'review'));
 }
@@ -578,3 +592,4 @@ export function omitRequired(schema) {
 
   return newSchema;
 }
+

src/js/review/ReviewChapters.jsx

@@ -7,9 +7,8 @@ import Scroll from 'react-scroll';
 import ReviewCollapsibleChapter from './ReviewCollapsibleChapter';
 import {
   createPageListByChapter,
-  expandArrayPages,
+  getActiveExpandedPages,
   getActiveChapters,
-  getActivePages,
   getPageKeys
 } from '../helpers';
 import {
@@ -75,8 +74,7 @@ class ReviewChapters extends React.Component {
       chapters,
       form,
       formContext,
-      setValid,
-      viewedPages
+      setValid, viewedPages
     } = this.props;
 
     return (
@@ -106,7 +104,7 @@ class ReviewChapters extends React.Component {
   }
 }
 
-function mapStateToProps(state, ownProps) {
+export function mapStateToProps(state, ownProps) {
   // from ownprops
   const {
     formConfig,
@@ -125,8 +123,7 @@ function mapStateToProps(state, ownProps) {
   const chapters = chapterNames.map(chapterName => {
     const pages = pagesByChapter[chapterName];
 
-    const activePages = getActivePages(pages, formData);
-    const expandedPages = expandArrayPages(activePages, formData);
+    const expandedPages = getActiveExpandedPages(pages, formData);
     const chapterFormConfig = formConfig.chapters[chapterName];
     const open = openChapters.includes(chapterName);
     const pageKeys = getPageKeys(pages, formData);

src/js/review/SubmitController.jsx

@@ -8,8 +8,7 @@ import { PreSubmitSection } from '../components/PreSubmitSection';
 import { isValidForm } from '../validation';
 import {
   createPageListByChapter,
-  expandArrayPages,
-  getActivePages
+  getActiveExpandedPages
 } from '../helpers';
 import {
   setPreSubmit,
@@ -45,8 +44,7 @@ class SubmitController extends React.Component {
       router
     } = this.props;
 
-    const eligiblePageList = getActivePages(pageList, form.data);
-    const expandedPageList = expandArrayPages(eligiblePageList, this.props.form.data);
+    const expandedPageList = getActiveExpandedPages(pageList, form.data);
 
     // TODO: Fix this bug that assumes there is a confirmation page.
     // Actually, it assumes the app also doesn't add routes at the end!

src/js/routing.js

@@ -1,15 +1,12 @@
 import _ from 'lodash/fp';
-import { expandArrayPages, getActivePages } from './helpers';
+import { getActiveExpandedPages } from './helpers';
 
 /*
  * Returns the page list without conditional pages that have not satisfied
  * their dependencies and therefore should be skipped.
  */
 function getEligiblePages(pageList, data, pathname) {
-  // Any `showPagePerItem` pages are expanded to create items for each array item.
-  // We update the `path` for each of those pages to replace `:index` with the current item index.
-  const expandedPageList = expandArrayPages(pageList, data);
-  const eligiblePageList = getActivePages(expandedPageList, data);
+  const eligiblePageList = getActiveExpandedPages(pageList, data);
   const pageIndex = _.findIndex(item => item.path === pathname, eligiblePageList);
   return { pages: eligiblePageList, pageIndex };
 }

test/js/review/ReviewChapters.unit.spec.jsx

@@ -3,7 +3,7 @@ import { expect } from 'chai';
 import { mount } from 'enzyme';
 import sinon from 'sinon';
 
-import { ReviewChapters } from '../../../src/js/review/ReviewChapters';
+import { ReviewChapters, mapStateToProps } from '../../../src/js/review/ReviewChapters';
 
 describe('Schemaform review: ReviewChapters', () => {
   it('should handle editing', () => {
@@ -105,4 +105,43 @@ describe('Schemaform review: ReviewChapters', () => {
     instance.handleToggleChapter({ name: 'chapter3', open: true, pageKeys: 0 });
     expect(closeReviewChapter.calledWith('chapter3', 0)).to.be.true;
   });
+
+  it('should pass index to depends for pagePerItem pages', () => {
+    const formData = {
+      testArray: [{}]
+    };
+
+    const dependsStub = sinon.stub();
+    dependsStub.withArgs(formData, 0).returns(true);
+
+    mapStateToProps({
+      form: {
+        pages: {},
+        submission: {},
+        reviewPageView: {
+          openChapters: [],
+          viewedPages: new Set()
+        },
+        data: formData
+      }
+    }, {
+      formConfig: {
+        chapters: {
+          test: {
+            pages: {
+              testPage: {
+                path: '/testing/:index',
+                pagePerItem: true,
+                arrayPath: 'testArray',
+                depends: dependsStub
+              }
+            }
+          }
+        }
+      },
+      pageList: [{}]
+    });
+
+    expect(dependsStub.calledWith(formData, 0));
+  });
 });