amp-bind: Add function to print bind's scope (ampproject#8876)

extensions/amp-bind/0.1/bind-impl.js

@@ -22,7 +22,7 @@ import {dev, user} from '../../../src/log';
 import {deepMerge} from '../../../src/utils/object';
 import {getMode} from '../../../src/mode';
 import {formOrNullForElement} from '../../../src/form';
-import {isArray, toArray} from '../../../src/types';
+import {isArray, isObject, toArray} from '../../../src/types';
 import {isExperimentOn} from '../../../src/experiments';
 import {invokeWebWorker} from '../../../src/web-worker/amp-worker';
 import {isFiniteNumber} from '../../../src/types';
@@ -139,7 +139,7 @@ export class Bind {
 
     // Expose for testing on dev.
     if (getMode().localDev) {
-      AMP.reinitializeBind = this.initialize_.bind(this);
+      AMP.printState = this.printState_.bind(this);
     }
   }
 
@@ -943,6 +943,25 @@ export class Bind {
     return false;
   }
 
+  /**
+   * Print out the current state in the console.
+   * @private
+   */
+  printState_() {
+    const seen = [];
+    const s = JSON.stringify(this.scope_, (key, value) => {
+      if (isObject(value)) {
+        if (seen.includes(value)) {
+          return '[Circular]';
+        } else {
+          seen.push(value);
+        }
+      }
+      return value;
+    });
+    dev().info(TAG, s);
+  }
+
   /**
    * Wait for bind scan to finish for testing.
    *

extensions/amp-bind/amp-bind.md

@@ -408,7 +408,7 @@ Only binding to the following components and attributes are allowed:
 
 ## Debugging
 
-Test in development mode (with the URL fragment `#development=1`) to highlight warnings and errors during development.
+Test in development mode (with the URL fragment `#development=1`) to highlight warnings and errors during development and to access special debugging functions.
 
 ### Warnings
 
@@ -471,6 +471,10 @@ There are several types of runtime errors that may be encountered when working w
   </tr>
 </table>
 
+### Debugging State
+
+In development mode, use `AMP.printState()` to print the current state to the console.
+
 ## Appendix
 
 ### `<amp-state>` specification
@@ -489,7 +493,7 @@ An `amp-state` element may contain either a child `<script>` element **OR** a `s
 <amp-state id="myRemoteState" src="https://data.com/articles.json">
 </amp-state>
 ```
-<br>
+
 #### Attributes
 
 **src**