React 14.9<\/title>\n+ <link rel=\"stylesheet\" href=\"styles.css\" \/>\n+\n+ <script type=\"text\/javascript\">\n+ \/\/ Enable DevTools to inspect React inside of an <iframe>\n+ \/\/ This must run before React is loaded\n+ __REACT_DEVTOOLS_GLOBAL_HOOK__ = parent.__REACT_DEVTOOLS_GLOBAL_HOOK__;\n+ <\/script>\n+\n+ <script src=\"https:\/\/unpkg.com\/react@0.14.9\/dist\/react.js\"><\/script>\n+ <script src=\"https:\/\/unpkg.com\/react-dom@0.14.9\/dist\/react-dom.js\"><\/script>\n+ \n+ \n+ <script src=\"https:\/\/unpkg.com\/babel-standalone@6\/babel.min.js\"><\/script>\n+ <\/head>\n+ <body>\n+ <div id=\"root\">\n+ If you are seeing this message, you are likely viewing this file using the <code>file<\/code> protocol which does not support cross origin requests.\n+ <br\/><br\/>\n+ Use the <code>server<\/code> script instead:\n+ <br\/><br\/>\n+ <code>node .\/fixtures\/regression\/server.js<\/code><br\/>\n+ <code>open <a href=\"http:\/\/localhost:3000\/fixtures\/regression\/14.9.html\">http:\/\/localhost:3000\/fixtures\/regression\/14.9.html<\/a><\/code>\n+ <\/div>\n+\n+ <script src=\"shared.js\" type=\"text\/babel\"><\/script>\n+\n+ \n+ <\/body>\n+<\/html>\n\\ No newline at end of file\ndiff --git a\/fixtures\/regression\/15.0.html b\/fixtures\/regression\/15.0.html\nnew file mode 100644\nindex 0000000000..464ea1f548\n--- \/dev\/null\n+++ b\/fixtures\/regression\/15.0.html\n@@ -0,0 +1,38 @@\n+<!DOCTYPE html>\n+<html>\n+ <head>\n+ <meta charset=\"UTF-8\" \/>\n+ <title>React 15.0<\/title>\n+ <link rel=\"stylesheet\" href=\"styles.css\" \/>\n+\n+ <script type=\"text\/javascript\">\n+ \/\/ Enable DevTools to inspect React inside of an <iframe>\n+ \/\/ This must run before React is loaded\n+ __REACT_DEVTOOLS_GLOBAL_HOOK__ = parent.__REACT_DEVTOOLS_GLOBAL_HOOK__;\n+ <\/script>\n+\n+ <script src=\"https:\/\/unpkg.com\/react@15.0\/dist\/react.js\"><\/script>\n+ <script src=\"https:\/\/unpkg.com\/react-dom@15.0\/dist\/react-dom.js\"><\/script>\n+ \n+ \n+ <script src=\"https:\/\/unpkg.com\/babel-standalone@6\/babel.min.js\"><\/script>\n+ <\/head>\n+ <body>\n+ <div id=\"root\">\n+ If you are seeing this message, you are likely viewing this file using the <code>file<\/code> protocol which does not support cross origin requests.\n+ <br\/><br\/>\n+ Use the <code>server<\/code> script instead:\n+ <br\/><br\/>\n+ <code>node .\/fixtures\/regression\/server.js<\/code><br\/>\n+ <code>open <a href=\"http:\/\/localhost:3000\/fixtures\/regression\/15.0.html\">http:\/\/localhost:3000\/fixtures\/regression\/15.0.html<\/a><\/code>\n+ <\/div>\n+\n+ <script src=\"shared.js\" type=\"text\/babel\"><\/script>\n+\n+ \n+ <\/body>\n+<\/html>\n\\ No newline at end of file\ndiff --git a\/fixtures\/regression\/15.1.html b\/fixtures\/regression\/15.1.html\nnew file mode 100644\nindex 0000000000..7e02e81bf9\n--- \/dev\/null\n+++ b\/fixtures\/regression\/15.1.html\n@@ -0,0 +1,38 @@\n+<!DOCTYPE html>\n+<html>\n+ <head>\n+ <meta charset=\"UTF-8\" \/>\n+ <title>React 15.1<\/title>\n+ <link rel=\"stylesheet\" href=\"styles.css\" \/>\n+\n+ <script type=\"text\/javascript\">\n+ \/\/ Enable DevTools to inspect React inside of an <iframe>\n+ \/\/ This must run before React is loaded\n+ __REACT_DEVTOOLS_GLOBAL_HOOK__ = parent.__REACT_DEVTOOLS_GLOBAL_HOOK__;\n+ <\/script>\n+\n+ <script src=\"https:\/\/unpkg.com\/react@15.1\/dist\/react.js\"><\/script>\n+ <script src=\"https:\/\/unpkg.com\/react-dom@15.1\/dist\/react-dom.js\"><\/script>\n+ \n+ \n+ <script src=\"https:\/\/unpkg.com\/babel-standalone@6\/babel.min.js\"><\/script>\n+ <\/head>\n+ <body>\n+ <div id=\"root\">\n+ If you are seeing this message, you are likely viewing this file using the <code>file<\/code> protocol which does not support cross origin requests.\n+ <br\/><br\/>\n+ Use the <code>server<\/code> script instead:\n+ <br\/><br\/>\n+ <code>node .\/fixtures\/regression\/server.js<\/code><br\/>\n+ <code>open <a href=\"http:\/\/localhost:3000\/fixtures\/regression\/15.1.html\">http:\/\/localhost:3000\/fixtures\/regression\/15.1.html<\/a><\/code>\n+ <\/div>\n+\n+ <script src=\"shared.js\" type=\"text\/babel\"><\/script>\n+\n+ \n+ <\/body>\n+<\/html>\n\\ No newline at end of file\ndiff --git a\/fixtures\/regression\/15.2.html b\/fixtures\/regression\/15.2.html\nnew file mode 100644\nindex 0000000000..ff1e6b8746\n--- \/dev\/null\n+++ b\/fixtures\/regression\/15.2.html\n@@ -0,0 +1,38 @@\n+<!DOCTYPE html>\n+<html>\n+ <head>\n+ <meta charset=\"UTF-8\" \/>\n+ <title>React 15.2<\/title>\n+ <link rel=\"stylesheet\" href=\"styles.css\" \/>\n+\n+ <script type=\"text\/javascript\">\n+ \/\/ Enable DevTools to inspect React inside of an <iframe>\n+ \/\/ This must run before React is loaded\n+ __REACT_DEVTOOLS_GLOBAL_HOOK__ = parent.__REACT_DEVTOOLS_GLOBAL_HOOK__;\n+ <\/script>\n+\n+ <script src=\"https:\/\/unpkg.com\/react@15.2\/dist\/react.js\"><\/script>\n+ <script src=\"https:\/\/unpkg.com\/react-dom@15.2\/dist\/react-dom.js\"><\/script>\n+ \n+ \n+ <script src=\"https:\/\/unpkg.com\/babel-standalone@6\/babel.min.js\"><\/script>\n+ <\/head>\n+ <body>\n+ <div id=\"root\">\n+ If you are seeing this message, you are likely viewing this file using the <code>file<\/code> protocol which does not support cross origin requests.\n+ <br\/><br\/>\n+ Use the <code>server<\/code> script instead:\n+ <br\/><br\/>\n+ <code>node .\/fixtures\/regression\/server.js<\/code><br\/>\n+ <code>open <a href=\"http:\/\/localhost:3000\/fixtures\/regression\/15.2.html\">http:\/\/localhost:3000\/fixtures\/regression\/15.2.html<\/a><\/code>\n+ <\/div>\n+\n+ <script src=\"shared.js\" type=\"text\/babel\"><\/script>\n+\n+ \n+ <\/body>\n+<\/html>\n\\ No newline at end of file\ndiff --git a\/fixtures\/regression\/15.3.html b\/fixtures\/regression\/15.3.html\nnew file mode 100644\nindex 0000000000..8d1795962e\n--- \/dev\/null\n+++ b\/fixtures\/regression\/15.3.html\n@@ -0,0 +1,38 @@\n+<!DOCTYPE html>\n+<html>\n+ <head>\n+ <meta charset=\"UTF-8\" \/>\n+ <title>React 15.3<\/title>\n+ <link rel=\"stylesheet\" href=\"styles.css\" \/>\n+\n+ <script type=\"text\/javascript\">\n+ \/\/ Enable DevTools to inspect React inside of an <iframe>\n+ \/\/ This must run before React is loaded\n+ __REACT_DEVTOOLS_GLOBAL_HOOK__ = parent.__REACT_DEVTOOLS_GLOBAL_HOOK__;\n+ <\/script>\n+\n+ <script src=\"https:\/\/unpkg.com\/react@15.3\/dist\/react.js\"><\/script>\n+ <script src=\"https:\/\/unpkg.com\/react-dom@15.3\/dist\/react-dom.js\"><\/script>\n+ \n+ \n+ <script src=\"https:\/\/unpkg.com\/babel-standalone@6\/babel.min.js\"><\/script>\n+ <\/head>\n+ <body>\n+ <div id=\"root\">\n+ If you are seeing this message, you are likely viewing this file using the <code>file<\/code> protocol which does not support cross origin requests.\n+ <br\/><br\/>\n+ Use the <code>server<\/code> script instead:\n+ <br\/><br\/>\n+ <code>node .\/fixtures\/regression\/server.js<\/code><br\/>\n+ <code>open <a href=\"http:\/\/localhost:3000\/fixtures\/regression\/15.3.html\">http:\/\/localhost:3000\/fixtures\/regression\/15.3.html<\/a><\/code>\n+ <\/div>\n+\n+ <script src=\"shared.js\" type=\"text\/babel\"><\/script>\n+\n+ \n+ <\/body>\n+<\/html>\n\\ No newline at end of file\ndiff --git a\/fixtures\/regression\/15.4.html b\/fixtures\/regression\/15.4.html\nnew file mode 100644\nindex 0000000000..ee1bfc0723\n--- \/dev\/null\n+++ b\/fixtures\/regression\/15.4.html\n@@ -0,0 +1,38 @@\n+<!DOCTYPE html>\n+<html>\n+ <head>\n+ <meta charset=\"UTF-8\" \/>\n+ <title>React 15.4<\/title>\n+ <link rel=\"stylesheet\" href=\"styles.css\" \/>\n+\n+ <script type=\"text\/javascript\">\n+ \/\/ Enable DevTools to inspect React inside of an <iframe>\n+ \/\/ This must run before React is loaded\n+ __REACT_DEVTOOLS_GLOBAL_HOOK__ = parent.__REACT_DEVTOOLS_GLOBAL_HOOK__;\n+ <\/script>\n+\n+ <script src=\"https:\/\/unpkg.com\/react@15.4\/dist\/react.js\"><\/script>\n+ <script src=\"https:\/\/unpkg.com\/react-dom@15.4\/dist\/react-dom.js\"><\/script>\n+ \n+ \n+ <script src=\"https:\/\/unpkg.com\/babel-standalone@6\/babel.min.js\"><\/script>\n+ <\/head>\n+ <body>\n+ <div id=\"root\">\n+ If you are seeing this message, you are likely viewing this file using the <code>file<\/code> protocol which does not support cross origin requests.\n+ <br\/><br\/>\n+ Use the <code>server<\/code> script instead:\n+ <br\/><br\/>\n+ <code>node .\/fixtures\/regression\/server.js<\/code><br\/>\n+ <code>open <a href=\"http:\/\/localhost:3000\/fixtures\/regression\/15.4.html\">http:\/\/localhost:3000\/fixtures\/regression\/15.4.html<\/a><\/code>\n+ <\/div>\n+\n+ <script src=\"shared.js\" type=\"text\/babel\"><\/script>\n+\n+ \n+ <\/body>\n+<\/html>\n\\ No newline at end of file\ndiff --git a\/fixtures\/regression\/15.5.html b\/fixtures\/regression\/15.5.html\nnew file mode 100644\nindex 0000000000..4097bdf708\n--- \/dev\/null\n+++ b\/fixtures\/regression\/15.5.html\n@@ -0,0 +1,38 @@\n+<!DOCTYPE html>\n+<html>\n+ <head>\n+ <meta charset=\"UTF-8\" \/>\n+ <title>React 15.5<\/title>\n+ <link rel=\"stylesheet\" href=\"styles.css\" \/>\n+\n+ <script type=\"text\/javascript\">\n+ \/\/ Enable DevTools to inspect React inside of an <iframe>\n+ \/\/ This must run before React is loaded\n+ __REACT_DEVTOOLS_GLOBAL_HOOK__ = parent.__REACT_DEVTOOLS_GLOBAL_HOOK__;\n+ <\/script>\n+\n+ <script src=\"https:\/\/unpkg.com\/react@15.5\/dist\/react.js\"><\/script>\n+ <script src=\"https:\/\/unpkg.com\/react-dom@15.5\/dist\/react-dom.js\"><\/script>\n+ \n+ \n+ <script src=\"https:\/\/unpkg.com\/babel-standalone@6\/babel.min.js\"><\/script>\n+ <\/head>\n+ <body>\n+ <div id=\"root\">\n+ If you are seeing this message, you are likely viewing this file using the <code>file<\/code> protocol which does not support cross origin requests.\n+ <br\/><br\/>\n+ Use the <code>server<\/code> script instead:\n+ <br\/><br\/>\n+ <code>node .\/fixtures\/regression\/server.js<\/code><br\/>\n+ <code>open <a href=\"http:\/\/localhost:3000\/fixtures\/regression\/15.5.html\">http:\/\/localhost:3000\/fixtures\/regression\/15.5.html<\/a><\/code>\n+ <\/div>\n+\n+ <script src=\"shared.js\" type=\"text\/babel\"><\/script>\n+\n+ \n+ <\/body>\n+<\/html>\n\\ No newline at end of file\ndiff --git a\/fixtures\/regression\/15.6.html b\/fixtures\/regression\/15.6.html\nnew file mode 100644\nindex 0000000000..ab10ba8716\n--- \/dev\/null\n+++ b\/fixtures\/regression\/15.6.html\n@@ -0,0 +1,38 @@\n+<!DOCTYPE html>\n+<html>\n+ <head>\n+ <meta charset=\"UTF-8\" \/>\n+ <title>React 15.6<\/title>\n+ <link rel=\"stylesheet\" href=\"styles.css\" \/>\n+\n+ <script type=\"text\/javascript\">\n+ \/\/ Enable DevTools to inspect React inside of an <iframe>\n+ \/\/ This must run before React is loaded\n+ __REACT_DEVTOOLS_GLOBAL_HOOK__ = parent.__REACT_DEVTOOLS_GLOBAL_HOOK__;\n+ <\/script>\n+\n+ <script src=\"https:\/\/unpkg.com\/react@15.6\/dist\/react.js\"><\/script>\n+ <script src=\"https:\/\/unpkg.com\/react-dom@15.6\/dist\/react-dom.js\"><\/script>\n+ \n+ \n+ <script src=\"https:\/\/unpkg.com\/babel-standalone@6\/babel.min.js\"><\/script>\n+ <\/head>\n+ <body>\n+ <div id=\"root\">\n+ If you are seeing this message, you are likely viewing this file using the <code>file<\/code> protocol which does not support cross origin requests.\n+ <br\/><br\/>\n+ Use the <code>server<\/code> script instead:\n+ <br\/><br\/>\n+ <code>node .\/fixtures\/regression\/server.js<\/code><br\/>\n+ <code>open <a href=\"http:\/\/localhost:3000\/fixtures\/regression\/15.6.html\">http:\/\/localhost:3000\/fixtures\/regression\/15.6.html<\/a><\/code>\n+ <\/div>\n+\n+ <script src=\"shared.js\" type=\"text\/babel\"><\/script>\n+\n+ \n+ <\/body>\n+<\/html>\n\\ No newline at end of file\ndiff --git a\/fixtures\/regression\/16.0.html b\/fixtures\/regression\/16.0.html\nnew file mode 100644\nindex 0000000000..7c55d75114\n--- \/dev\/null\n+++ b\/fixtures\/regression\/16.0.html\n@@ -0,0 +1,38 @@\n+<!DOCTYPE html>\n+<html>\n+ <head>\n+ <meta charset=\"UTF-8\" \/>\n+ <title>React 16.0<\/title>\n+ <link rel=\"stylesheet\" href=\"styles.css\" \/>\n+\n+ <script type=\"text\/javascript\">\n+ \/\/ Enable DevTools to inspect React inside of an <iframe>\n+ \/\/ This must run before React is loaded\n+ __REACT_DEVTOOLS_GLOBAL_HOOK__ = parent.__REACT_DEVTOOLS_GLOBAL_HOOK__;\n+ <\/script>\n+\n+ <script src=\"https:\/\/unpkg.com\/react@16.0\/umd\/react.development.js\"><\/script>\n+ <script src=\"https:\/\/unpkg.com\/react-dom@16.0\/umd\/react-dom.development.js\"><\/script>\n+ \n+ \n+ <script src=\"https:\/\/unpkg.com\/babel-standalone@6\/babel.min.js\"><\/script>\n+ <\/head>\n+ <body>\n+ <div id=\"root\">\n+ If you are seeing this message, you are likely viewing this file using the <code>file<\/code> protocol which does not support cross origin requests.\n+ <br\/><br\/>\n+ Use the <code>server<\/code> script instead:\n+ <br\/><br\/>\n+ <code>node .\/fixtures\/regression\/server.js<\/code><br\/>\n+ <code>open <a href=\"http:\/\/localhost:3000\/fixtures\/regression\/16.0.html\">http:\/\/localhost:3000\/fixtures\/regression\/16.0.html<\/a><\/code>\n+ <\/div>\n+\n+ <script src=\"shared.js\" type=\"text\/babel\"><\/script>\n+\n+ \n+ <\/body>\n+<\/html>\n\\ No newline at end of file\ndiff --git a\/fixtures\/regression\/16.1.html b\/fixtures\/regression\/16.1.html\nnew file mode 100644\nindex 0000000000..d93addf46e\n--- \/dev\/null\n+++ b\/fixtures\/regression\/16.1.html\n@@ -0,0 +1,38 @@\n+<!DOCTYPE html>\n+<html>\n+ <head>\n+ <meta charset=\"UTF-8\" \/>\n+ <title>React 16.1<\/title>\n+ <link rel=\"stylesheet\" href=\"styles.css\" \/>\n+\n+ <script type=\"text\/javascript\">\n+ \/\/ Enable DevTools to inspect React inside of an <iframe>\n+ \/\/ This must run before React is loaded\n+ __REACT_DEVTOOLS_GLOBAL_HOOK__ = parent.__REACT_DEVTOOLS_GLOBAL_HOOK__;\n+ <\/script>\n+\n+ <script src=\"https:\/\/unpkg.com\/react@16.1\/umd\/react.development.js\"><\/script>\n+ <script src=\"https:\/\/unpkg.com\/react-dom@16.1\/umd\/react-dom.development.js\"><\/script>\n+ \n+ \n+ <script src=\"https:\/\/unpkg.com\/babel-standalone@6\/babel.min.js\"><\/script>\n+ <\/head>\n+ <body>\n+ <div id=\"root\">\n+ If you are seeing this message, you are likely viewing this file using the <code>file<\/code> protocol which does not support cross origin requests.\n+ <br\/><br\/>\n+ Use the <code>server<\/code> script instead:\n+ <br\/><br\/>\n+ <code>node .\/fixtures\/regression\/server.js<\/code><br\/>\n+ <code>open <a href=\"http:\/\/localhost:3000\/fixtures\/regression\/16.1.html\">http:\/\/localhost:3000\/fixtures\/regression\/16.1.html<\/a><\/code>\n+ <\/div>\n+\n+ <script src=\"shared.js\" type=\"text\/babel\"><\/script>\n+\n+ \n+ <\/body>\n+<\/html>\n\\ No newline at end of file\ndiff --git a\/fixtures\/regression\/16.2.html b\/fixtures\/regression\/16.2.html\nnew file mode 100644\nindex 0000000000..10d8e150ed\n--- \/dev\/null\n+++ b\/fixtures\/regression\/16.2.html\n@@ -0,0 +1,38 @@\n+<!DOCTYPE html>\n+<html>\n+ <head>\n+ <meta charset=\"UTF-8\" \/>\n+ <title>React 16.2<\/title>\n+ <link rel=\"stylesheet\" href=\"styles.css\" \/>\n+\n+ <script type=\"text\/javascript\">\n+ \/\/ Enable DevTools to inspect React inside of an <iframe>\n+ \/\/ This must run before React is loaded\n+ __REACT_DEVTOOLS_GLOBAL_HOOK__ = parent.__REACT_DEVTOOLS_GLOBAL_HOOK__;\n+ <\/script>\n+\n+ <script src=\"https:\/\/unpkg.com\/react@16.2\/umd\/react.development.js\"><\/script>\n+ <script src=\"https:\/\/unpkg.com\/react-dom@16.2\/umd\/react-dom.development.js\"><\/script>\n+ \n+ \n+ <script src=\"https:\/\/unpkg.com\/babel-standalone@6\/babel.min.js\"><\/script>\n+ <\/head>\n+ <body>\n+ <div id=\"root\">\n+ If you are seeing this message, you are likely viewing this file using the <code>file<\/code> protocol which does not support cross origin requests.\n+ <br\/><br\/>\n+ Use the <code>server<\/code> script instead:\n+ <br\/><br\/>\n+ <code>node .\/fixtures\/regression\/server.js<\/code><br\/>\n+ <code>open <a href=\"http:\/\/localhost:3000\/fixtures\/regression\/16.2.html\">http:\/\/localhost:3000\/fixtures\/regression\/16.2.html<\/a><\/code>\n+ <\/div>\n+\n+ <script src=\"shared.js\" type=\"text\/babel\"><\/script>\n+\n+ \n+ <\/body>\n+<\/html>\n\\ No newline at end of file\ndiff --git a\/fixtures\/regression\/16.3.html b\/fixtures\/regression\/16.3.html\nnew file mode 100644\nindex 0000000000..2e42e2813a\n--- \/dev\/null\n+++ b\/fixtures\/regression\/16.3.html\n@@ -0,0 +1,38 @@\n+<!DOCTYPE html>\n+<html>\n+ <head>\n+ <meta charset=\"UTF-8\" \/>\n+ <title>React 16.3<\/title>\n+ <link rel=\"stylesheet\" href=\"styles.css\" \/>\n+\n+ <script type=\"text\/javascript\">\n+ \/\/ Enable DevTools to inspect React inside of an <iframe>\n+ \/\/ This must run before React is loaded\n+ __REACT_DEVTOOLS_GLOBAL_HOOK__ = parent.__REACT_DEVTOOLS_GLOBAL_HOOK__;\n+ <\/script>\n+\n+ <script src=\"https:\/\/unpkg.com\/react@16.3\/umd\/react.development.js\"><\/script>\n+ <script src=\"https:\/\/unpkg.com\/react-dom@16.3\/umd\/react-dom.development.js\"><\/script>\n+ \n+ \n+ <script src=\"https:\/\/unpkg.com\/babel-standalone@6\/babel.min.js\"><\/script>\n+ <\/head>\n+ <body>\n+ <div id=\"root\">\n+ If you are seeing this message, you are likely viewing this file using the <code>file<\/code> protocol which does not support cross origin requests.\n+ <br\/><br\/>\n+ Use the <code>server<\/code> script instead:\n+ <br\/><br\/>\n+ <code>node .\/fixtures\/regression\/server.js<\/code><br\/>\n+ <code>open <a href=\"http:\/\/localhost:3000\/fixtures\/regression\/16.3.html\">http:\/\/localhost:3000\/fixtures\/regression\/16.3.html<\/a><\/code>\n+ <\/div>\n+\n+ <script src=\"shared.js\" type=\"text\/babel\"><\/script>\n+\n+ \n+ <\/body>\n+<\/html>\n\\ No newline at end of file\ndiff --git a\/fixtures\/regression\/16.4.html b\/fixtures\/regression\/16.4.html\nnew file mode 100644\nindex 0000000000..f59f4e9e6f\n--- \/dev\/null\n+++ b\/fixtures\/regression\/16.4.html\n@@ -0,0 +1,38 @@\n+<!DOCTYPE html>\n+<html>\n+ <head>\n+ <meta charset=\"UTF-8\" \/>\n+ <title>React 16.4<\/title>\n+ <link rel=\"stylesheet\" href=\"styles.css\" \/>\n+\n+ <script type=\"text\/javascript\">\n+ \/\/ Enable DevTools to inspect React inside of an <iframe>\n+ \/\/ This must run before React is loaded\n+ __REACT_DEVTOOLS_GLOBAL_HOOK__ = parent.__REACT_DEVTOOLS_GLOBAL_HOOK__;\n+ <\/script>\n+\n+ <script src=\"https:\/\/unpkg.com\/react@16.4\/umd\/react.development.js\"><\/script>\n+ <script src=\"https:\/\/unpkg.com\/react-dom@16.4\/umd\/react-dom.development.js\"><\/script>\n+ \n+ \n+ <script src=\"https:\/\/unpkg.com\/babel-standalone@6\/babel.min.js\"><\/script>\n+ <\/head>\n+ <body>\n+ <div id=\"root\">\n+ If you are seeing this message, you are likely viewing this file using the <code>file<\/code> protocol which does not support cross origin requests.\n+ <br\/><br\/>\n+ Use the <code>server<\/code> script instead:\n+ <br\/><br\/>\n+ <code>node .\/fixtures\/regression\/server.js<\/code><br\/>\n+ <code>open <a href=\"http:\/\/localhost:3000\/fixtures\/regression\/16.4.html\">http:\/\/localhost:3000\/fixtures\/regression\/16.4.html<\/a><\/code>\n+ <\/div>\n+\n+ <script src=\"shared.js\" type=\"text\/babel\"><\/script>\n+\n+ \n+ <\/body>\n+<\/html>\n\\ No newline at end of file\ndiff --git a\/fixtures\/regression\/16.5.html b\/fixtures\/regression\/16.5.html\nnew file mode 100644\nindex 0000000000..455e06f219\n--- \/dev\/null\n+++ b\/fixtures\/regression\/16.5.html\n@@ -0,0 +1,40 @@\n+<!DOCTYPE html>\n+<html>\n+ <head>\n+ <meta charset=\"UTF-8\" \/>\n+ <title>React 16.5<\/title>\n+ <link rel=\"stylesheet\" href=\"styles.css\" \/>\n+\n+ <script type=\"text\/javascript\">\n+ \/\/ Enable DevTools to inspect React inside of an <iframe>\n+ \/\/ This must run before React is loaded\n+ __REACT_DEVTOOLS_GLOBAL_HOOK__ = parent.__REACT_DEVTOOLS_GLOBAL_HOOK__;\n+ <\/script>\n+\n+ <script src=\"https:\/\/unpkg.com\/schedule@0.5.0\/umd\/schedule.development.js\"><\/script>\n+ <script src=\"https:\/\/unpkg.com\/schedule@0.5.0\/umd\/schedule-tracing.development.js\"><\/script>\n+ <script src=\"https:\/\/unpkg.com\/react@16.5\/umd\/react.development.js\"><\/script>\n+ <script src=\"https:\/\/unpkg.com\/react-dom@16.5\/umd\/react-dom.development.js\"><\/script>\n+ \n+ \n+ <script src=\"https:\/\/unpkg.com\/babel-standalone@6\/babel.min.js\"><\/script>\n+ <\/head>\n+ <body>\n+ <div id=\"root\">\n+ If you are seeing this message, you are likely viewing this file using the <code>file<\/code> protocol which does not support cross origin requests.\n+ <br\/><br\/>\n+ Use the <code>server<\/code> script instead:\n+ <br\/><br\/>\n+ <code>node .\/fixtures\/regression\/server.js<\/code><br\/>\n+ <code>open <a href=\"http:\/\/localhost:3000\/fixtures\/regression\/16.5.html\">http:\/\/localhost:3000\/fixtures\/regression\/16.5.html<\/a><\/code>\n+ <\/div>\n+\n+ <script src=\"shared.js\" type=\"text\/babel\"><\/script>\n+\n+ \n+ <\/body>\n+<\/html>\n\\ No newline at end of file\ndiff --git a\/fixtures\/regression\/16.6.html b\/fixtures\/regression\/16.6.html\nnew file mode 100644\nindex 0000000000..1f61c47f85\n--- \/dev\/null\n+++ b\/fixtures\/regression\/16.6.html\n@@ -0,0 +1,41 @@\n+<!DOCTYPE html>\n+<html>\n+ <head>\n+ <meta charset=\"UTF-8\" \/>\n+ <title>React 16.6<\/title>\n+ <link rel=\"stylesheet\" href=\"styles.css\" \/>\n+\n+ <script type=\"text\/javascript\">\n+ \/\/ Enable DevTools to inspect React inside of an <iframe>\n+ \/\/ This must run before React is loaded\n+ __REACT_DEVTOOLS_GLOBAL_HOOK__ = parent.__REACT_DEVTOOLS_GLOBAL_HOOK__;\n+ <\/script>\n+\n+ <script src=\"https:\/\/unpkg.com\/scheduler@0.10.0\/umd\/scheduler.development.js\"><\/script>\n+ <script src=\"https:\/\/unpkg.com\/scheduler@0.10.0\/umd\/scheduler-tracing.development.js\"><\/script>\n+ <script src=\"https:\/\/unpkg.com\/react@16.6\/umd\/react.development.js\"><\/script>\n+ <script src=\"https:\/\/unpkg.com\/react-dom@16.6\/umd\/react-dom.development.js\"><\/script>\n+ <script src=\"https:\/\/unpkg.com\/react-cache@2.0.0-alpha.1\/umd\/react-cache.development.js\"><\/script>\n+ \n+ \n+ <script src=\"https:\/\/unpkg.com\/babel-standalone@6\/babel.min.js\"><\/script>\n+ <\/head>\n+ <body>\n+ <div id=\"root\">\n+ If you are seeing this message, you are likely viewing this file using the <code>file<\/code> protocol which does not support cross origin requests.\n+ <br\/><br\/>\n+ Use the <code>server<\/code> script instead:\n+ <br\/><br\/>\n+ <code>node .\/fixtures\/regression\/server.js<\/code><br\/>\n+ <code>open <a href=\"http:\/\/localhost:3000\/fixtures\/regression\/16.6.html\">http:\/\/localhost:3000\/fixtures\/regression\/16.6.html<\/a><\/code>\n+ <\/div>\n+\n+ <script src=\"shared.js\" type=\"text\/babel\"><\/script>\n+\n+ \n+ <\/body>\n+<\/html>\n\\ No newline at end of file\ndiff --git a\/fixtures\/regression\/16.7.html b\/fixtures\/regression\/16.7.html\nnew file mode 100644\nindex 0000000000..d839d7e030\n--- \/dev\/null\n+++ b\/fixtures\/regression\/16.7.html\n@@ -0,0 +1,41 @@\n+<!DOCTYPE html>\n+<html>\n+ <head>\n+ <meta charset=\"UTF-8\" \/>\n+ <title>React 16.7<\/title>\n+ <link rel=\"stylesheet\" href=\"styles.css\" \/>\n+\n+ <script type=\"text\/javascript\">\n+ \/\/ Enable DevTools to inspect React inside of an <iframe>\n+ \/\/ This must run before React is loaded\n+ __REACT_DEVTOOLS_GLOBAL_HOOK__ = parent.__REACT_DEVTOOLS_GLOBAL_HOOK__;\n+ <\/script>\n+\n+ <script src=\"https:\/\/unpkg.com\/scheduler@0.12.0\/umd\/scheduler.development.js\"><\/script>\n+ <script src=\"https:\/\/unpkg.com\/scheduler@0.12.0\/umd\/scheduler-tracing.development.js\"><\/script>\n+ <script src=\"https:\/\/unpkg.com\/react@16.7\/umd\/react.development.js\"><\/script>\n+ <script src=\"https:\/\/unpkg.com\/react-dom@16.7\/umd\/react-dom.development.js\"><\/script>\n+ <script src=\"https:\/\/unpkg.com\/react-cache@2.0.0-alpha.1\/umd\/react-cache.development.js\"><\/script>\n+ \n+ \n+ <script src=\"https:\/\/unpkg.com\/babel-standalone@6\/babel.min.js\"><\/script>\n+ <\/head>\n+ <body>\n+ <div id=\"root\">\n+ If you are seeing this message, you are likely viewing this file using the <code>file<\/code> protocol which does not support cross origin requests.\n+ <br\/><br\/>\n+ Use the <code>server<\/code> script instead:\n+ <br\/><br\/>\n+ <code>node .\/fixtures\/regression\/server.js<\/code><br\/>\n+ <code>open <a href=\"http:\/\/localhost:3000\/fixtures\/regression\/16.7.html\">http:\/\/localhost:3000\/fixtures\/regression\/16.7.html<\/a><\/code>\n+ <\/div>\n+\n+ <script src=\"shared.js\" type=\"text\/babel\"><\/script>\n+\n+ \n+ <\/body>\n+<\/html>\n\\ No newline at end of file\ndiff --git a\/fixtures\/regression\/canary.html b\/fixtures\/regression\/canary.html\nnew file mode 100644\nindex 0000000000..ab59d7029e\n--- \/dev\/null\n+++ b\/fixtures\/regression\/canary.html\n@@ -0,0 +1,41 @@\n+<!DOCTYPE html>\n+<html>\n+ <head>\n+ <meta charset=\"UTF-8\" \/>\n+ <title>React canary<\/title>\n+ <link rel=\"stylesheet\" href=\"styles.css\" \/>\n+\n+ <script type=\"text\/javascript\">\n+ \/\/ Enable DevTools to inspect React inside of an <iframe>\n+ \/\/ This must run before React is loaded\n+ __REACT_DEVTOOLS_GLOBAL_HOOK__ = parent.__REACT_DEVTOOLS_GLOBAL_HOOK__;\n+ <\/script>\n+\n+ <script src=\"https:\/\/unpkg.com\/scheduler@canary\/umd\/scheduler.development.js\"><\/script>\n+ <script src=\"https:\/\/unpkg.com\/scheduler@canary\/umd\/scheduler-tracing.development.js\"><\/script>\n+ <script src=\"https:\/\/unpkg.com\/react@canary\/umd\/react.development.js\"><\/script>\n+ <script src=\"https:\/\/unpkg.com\/react-dom@canary\/umd\/react-dom.development.js\"><\/script>\n+ <script src=\"https:\/\/unpkg.com\/react-cache@next\/umd\/react-cache.development.js\"><\/script>\n+ \n+ \n+ <script src=\"https:\/\/unpkg.com\/babel-standalone@6\/babel.min.js\"><\/script>\n+ <\/head>\n+ <body>\n+ <div id=\"root\">\n+ If you are seeing this message, you are likely viewing this file using the <code>file<\/code> protocol which does not support cross origin requests.\n+ <br\/><br\/>\n+ Use the <code>server<\/code> script instead:\n+ <br\/><br\/>\n+ <code>node .\/fixtures\/regression\/server.js<\/code><br\/>\n+ <code>open <a href=\"http:\/\/localhost:3000\/fixtures\/regression\/canary.html\">http:\/\/localhost:3000\/fixtures\/regression\/canary.html<\/a><\/code>\n+ <\/div>\n+\n+ <script src=\"shared.js\" type=\"text\/babel\"><\/script>\n+\n+ \n+ <\/body>\n+<\/html>\n\\ No newline at end of file\ndiff --git a\/fixtures\/regression\/index.html b\/fixtures\/regression\/index.html\nnew file mode 100644\nindex 0000000000..125a8e8baf\n--- \/dev\/null\n+++ b\/fixtures\/regression\/index.html\n@@ -0,0 +1,28 @@\n+<!DOCTYPE html>\n+<html>\n+ <head>\n+ <meta charset=\"UTF-8\" \/>\n+ <title>React DevTools regression test<\/title>\n+ <link rel=\"stylesheet\" href=\"styles.css\" \/>\n+ <\/head>\n+ <body>\n+ <iframe src=\"canary.html\"><\/iframe>\n+ <iframe src=\"next.html\"><\/iframe>\n+ <iframe src=\"16.7.html\"><\/iframe>\n+ <iframe src=\"16.6.html\"><\/iframe>\n+ <iframe src=\"16.5.html\"><\/iframe>\n+ <iframe src=\"16.4.html\"><\/iframe>\n+ <iframe src=\"16.3.html\"><\/iframe>\n+ <iframe src=\"16.2.html\"><\/iframe>\n+ <iframe src=\"16.1.html\"><\/iframe>\n+ <iframe src=\"16.0.html\"><\/iframe>\n+ <iframe src=\"15.6.html\"><\/iframe>\n+ <iframe src=\"15.5.html\"><\/iframe>\n+ <iframe src=\"15.4.html\"><\/iframe>\n+ <iframe src=\"15.3.html\"><\/iframe>\n+ <iframe src=\"15.2.html\"><\/iframe>\n+ <iframe src=\"15.1.html\"><\/iframe>\n+ <iframe src=\"15.0.html\"><\/iframe>\n+ <iframe src=\"14.9.html\"><\/iframe>\n+ <\/body>\n+<\/html>\n\\ No newline at end of file\ndiff --git a\/fixtures\/regression\/next.html b\/fixtures\/regression\/next.html\nnew file mode 100644\nindex 0000000000..77bb9bbed2\n--- \/dev\/null\n+++ b\/fixtures\/regression\/next.html\n@@ -0,0 +1,41 @@\n+<!DOCTYPE html>\n+<html>\n+ <head>\n+ <meta charset=\"UTF-8\" \/>\n+ <title>React next<\/title>\n+ <link rel=\"stylesheet\" href=\"styles.css\" \/>\n+\n+ <script type=\"text\/javascript\">\n+ \/\/ Enable DevTools to inspect React inside of an <iframe>\n+ \/\/ This must run before React is loaded\n+ __REACT_DEVTOOLS_GLOBAL_HOOK__ = parent.__REACT_DEVTOOLS_GLOBAL_HOOK__;\n+ <\/script>\n+\n+ <script src=\"https:\/\/unpkg.com\/scheduler@next\/umd\/scheduler.development.js\"><\/script>\n+ <script src=\"https:\/\/unpkg.com\/scheduler@next\/umd\/scheduler-tracing.development.js\"><\/script>\n+ <script src=\"https:\/\/unpkg.com\/react@next\/umd\/react.development.js\"><\/script>\n+ <script src=\"https:\/\/unpkg.com\/react-dom@next\/umd\/react-dom.development.js\"><\/script>\n+ <script src=\"https:\/\/unpkg.com\/react-cache@next\/umd\/react-cache.development.js\"><\/script>\n+ \n+ \n+ <script src=\"https:\/\/unpkg.com\/babel-standalone@6\/babel.min.js\"><\/script>\n+ <\/head>\n+ <body>\n+ <div id=\"root\">\n+ If you are seeing this message, you are likely viewing this file using the <code>file<\/code> protocol which does not support cross origin requests.\n+ <br\/><br\/>\n+ Use the <code>server<\/code> script instead:\n+ <br\/><br\/>\n+ <code>node .\/fixtures\/regression\/server.js<\/code><br\/>\n+ <code>open <a href=\"http:\/\/localhost:3000\/fixtures\/regression\/next.html\">http:\/\/localhost:3000\/fixtures\/regression\/next.html<\/a><\/code>\n+ <\/div>\n+\n+ <script src=\"shared.js\" type=\"text\/babel\"><\/script>\n+\n+ \n+ <\/body>\n+<\/html>\n\\ No newline at end of file\ndiff --git a\/fixtures\/regression\/server.js b\/fixtures\/regression\/server.js\nnew file mode 100755\nindex 0000000000..f7e03f075d\n--- \/dev\/null\n+++ b\/fixtures\/regression\/server.js\n@@ -0,0 +1,16 @@\n+#!\/usr\/bin\/env node\n+\n+const finalhandler = require('finalhandler');\n+const http = require('http');\n+const serveStatic = require('serve-static');\n+\n+\/\/ Serve fixtures folder\n+const serve = serveStatic(__dirname, { index: 'index.html' });\n+\n+\/\/ Create server\n+const server = http.createServer(function onRequest(req, res) {\n+ serve(req, res, finalhandler(req, res));\n+});\n+\n+\/\/ Listen\n+server.listen(3000);\ndiff --git a\/fixtures\/regression\/shared.js b\/fixtures\/regression\/shared.js\nnew file mode 100644\nindex 0000000000..2afd063b6b\n--- \/dev\/null\n+++ b\/fixtures\/regression\/shared.js\n@@ -0,0 +1,330 @@\n+\/* eslint-disable no-fallthrough, react\/react-in-jsx-scope, react\/jsx-no-undef *\/\n+\/* global React ReactCache ReactDOM SchedulerTracing ScheduleTracing *\/\n+\n+const apps = [];\n+\n+const pieces = React.version.split('.');\n+const major =\n+ pieces[0] === '0' ? parseInt(pieces[1], 10) : parseInt(pieces[0], 10);\n+const minor =\n+ pieces[0] === '0' ? parseInt(pieces[2], 10) : parseInt(pieces[1], 10);\n+\n+\/\/ Convenience wrapper to organize API features in DevTools.\n+function Feature({ children, label, version }) {\n+ return (\n+ <div className=\"Feature\">\n+ <div className=\"FeatureHeader\">\n+ <code className=\"FeatureCode\">{label}<\/code>\n+ <small>{version}<\/small>\n+ <\/div>\n+ {children}\n+ <\/div>\n+ );\n+}\n+\n+\/\/ Simplify interaction tracing for tests below.\n+let trace = null;\n+if (typeof SchedulerTracing !== 'undefined') {\n+ trace = SchedulerTracing.unstable_trace;\n+} else if (typeof ScheduleTracing !== 'undefined') {\n+ trace = ScheduleTracing.unstable_trace;\n+} else {\n+ trace = (_, __, callback) => callback();\n+}\n+\n+\/\/ https:\/\/github.com\/facebook\/react\/blob\/master\/CHANGELOG.md\n+switch (major) {\n+ case 16:\n+ switch (minor) {\n+ case 7:\n+ if (typeof React.useState === 'function') {\n+ \/\/ Hooks\n+ function Hooks() {\n+ const [count, setCount] = React.useState(0);\n+ const incrementCount = React.useCallback(\n+ () => setCount(count + 1),\n+ [count]\n+ );\n+ return (\n+ <div>\n+ count: {count}{' '}\n+ <button onClick={incrementCount}>increment<\/button>\n+ <\/div>\n+ );\n+ }\n+ apps.push(\n+ <Feature key=\"Hooks\" label=\"Hooks\" version=\"16.7+\">\n+ <Hooks \/>\n+ <\/Feature>\n+ );\n+ }\n+ case 6:\n+ \/\/ memo\n+ function LabelComponent({ label }) {\n+ return <label>{label}<\/label>;\n+ }\n+ const AnonymousMemoized = React.memo(({ label }) => (\n+ <label>{label}<\/label>\n+ ));\n+ const Memoized = React.memo(LabelComponent);\n+ const CustomMemoized = React.memo(LabelComponent);\n+ CustomMemoized.displayName = 'MemoizedLabelFunction';\n+ apps.push(\n+ <Feature key=\"memo\" label=\"memo\" version=\"16.6+\">\n+ <AnonymousMemoized label=\"AnonymousMemoized\" \/>\n+ <Memoized label=\"Memoized\" \/>\n+ <CustomMemoized label=\"CustomMemoized\" \/>\n+ <\/Feature>\n+ );\n+\n+ \/\/ Suspense\n+ const loadResource = ([text, ms]) => {\n+ return new Promise((resolve, reject) => {\n+ setTimeout(() => {\n+ resolve(text);\n+ }, ms);\n+ });\n+ };\n+ const getResourceKey = ([text, ms]) => text;\n+ const Resource = ReactCache.unstable_createResource(\n+ loadResource,\n+ getResourceKey\n+ );\n+ class Suspending extends React.Component {\n+ state = { useSuspense: false };\n+ useSuspense = () => this.setState({ useSuspense: true });\n+ render() {\n+ if (this.state.useSuspense) {\n+ const text = Resource.read(['loaded', 2000]);\n+ return text;\n+ } else {\n+ return <button onClick={this.useSuspense}>load data<\/button>;\n+ }\n+ }\n+ }\n+ apps.push(\n+ <Feature key=\"Suspense\" label=\"Suspense\" version=\"16.6+\">\n+ <React.Suspense fallback={<div>loading...<\/div>}>\n+ <Suspending \/>\n+ <\/React.Suspense>\n+ <\/Feature>\n+ );\n+\n+ \/\/ lazy\n+ const LazyWithDefaultProps = React.lazy(\n+ () =>\n+ new Promise(resolve => {\n+ function FooWithDefaultProps(props) {\n+ return (\n+ <h1>\n+ {props.greeting}, {props.name}\n+ <\/h1>\n+ );\n+ }\n+ FooWithDefaultProps.defaultProps = {\n+ name: 'World',\n+ greeting: 'Bonjour',\n+ };\n+ resolve({\n+ default: FooWithDefaultProps,\n+ });\n+ })\n+ );\n+ apps.push(\n+ <Feature key=\"lazy\" label=\"lazy\" version=\"16.6+\">\n+ <React.Suspense fallback={<div>loading...<\/div>}>\n+ <LazyWithDefaultProps greeting=\"Hello\" \/>\n+ <\/React.Suspense>\n+ <\/Feature>\n+ );\n+ case 5:\n+ case 4:\n+ \/\/ unstable_Profiler\n+ class ProfilerChild extends React.Component {\n+ state = { count: 0 };\n+ incrementCount = () =>\n+ this.setState(prevState => ({ count: prevState.count + 1 }));\n+ render() {\n+ return (\n+ <div>\n+ count: {this.state.count}{' '}\n+ <button onClick={this.incrementCount}>increment<\/button>\n+ <\/div>\n+ );\n+ }\n+ }\n+ const onRender = (...args) => {};\n+ const Profiler = React.unstable_Profiler || React.Profiler;\n+ apps.push(\n+ <Feature\n+ key=\"unstable_Profiler\"\n+ label=\"unstable_Profiler\"\n+ version=\"16.4+\"\n+ >\n+ <Profiler id=\"count\" onRender={onRender}>\n+ <div>\n+ <ProfilerChild \/>\n+ <\/div>\n+ <\/Profiler>\n+ <\/Feature>\n+ );\n+ case 3:\n+ \/\/ createContext()\n+ const LocaleContext = React.createContext();\n+ LocaleContext.displayName = 'LocaleContext';\n+ const ThemeContext = React.createContext();\n+ apps.push(\n+ <Feature key=\"createContext\" label=\"createContext\" version=\"16.3+\">\n+ <ThemeContext.Provider value=\"blue\">\n+ <ThemeContext.Consumer>\n+ {theme => <div>theme: {theme}<\/div>}\n+ <\/ThemeContext.Consumer>\n+ <\/ThemeContext.Provider>\n+ <LocaleContext.Provider value=\"en-US\">\n+ <LocaleContext.Consumer>\n+ {locale => <div>locale: {locale}<\/div>}\n+ <\/LocaleContext.Consumer>\n+ <\/LocaleContext.Provider>\n+ <\/Feature>\n+ );\n+\n+ \/\/ forwardRef()\n+ const AnonymousFunction = React.forwardRef((props, ref) => (\n+ <div ref={ref}>{props.children}<\/div>\n+ ));\n+ const NamedFunction = React.forwardRef(function named(props, ref) {\n+ return <div ref={ref}>{props.children}<\/div>;\n+ });\n+ const CustomName = React.forwardRef((props, ref) => (\n+ <div ref={ref}>{props.children}<\/div>\n+ ));\n+ CustomName.displayName = 'CustomNameForwardRef';\n+ apps.push(\n+ <Feature key=\"forwardRef\" label=\"forwardRef\" version=\"16.3+\">\n+ <AnonymousFunction>AnonymousFunction<\/AnonymousFunction>\n+ <NamedFunction>NamedFunction<\/NamedFunction>\n+ <CustomName>CustomName<\/CustomName>\n+ <\/Feature>\n+ );\n+\n+ \/\/ StrictMode\n+ class StrictModeChild extends React.Component {\n+ render() {\n+ return 'StrictModeChild';\n+ }\n+ }\n+ apps.push(\n+ <Feature key=\"StrictMode\" label=\"StrictMode\" version=\"16.3+\">\n+ <React.StrictMode>\n+ <StrictModeChild \/>\n+ <\/React.StrictMode>\n+ <\/Feature>\n+ );\n+\n+ \/\/ unstable_AsyncMode (later renamed to unstable_ConcurrentMode, then ConcurrentMode)\n+ const ConcurrentMode =\n+ React.ConcurrentMode ||\n+ React.unstable_ConcurrentMode ||\n+ React.unstable_AsyncMode;\n+ apps.push(\n+ <Feature\n+ key=\"AsyncMode\/ConcurrentMode\"\n+ label=\"AsyncMode\/ConcurrentMode\"\n+ version=\"16.3+\"\n+ >\n+ <ConcurrentMode>\n+ <div>\n+ unstable_AsyncMode was added in 16.3, renamed to\n+ unstable_ConcurrentMode in 16.5, and then renamed to\n+ ConcurrentMode in 16.7\n+ <\/div>\n+ <\/ConcurrentMode>\n+ <\/Feature>\n+ );\n+ case 2:\n+ \/\/ Fragment\n+ apps.push(\n+ <Feature key=\"Fragment\" label=\"Fragment\" version=\"16.4+\">\n+ <React.Fragment>\n+ <div>one<\/div>\n+ <div>two<\/div>\n+ <\/React.Fragment>\n+ <\/Feature>\n+ );\n+ case 1:\n+ case 0:\n+ default:\n+ break;\n+ }\n+ break;\n+ case 15:\n+ break;\n+ case 14:\n+ break;\n+ default:\n+ break;\n+}\n+\n+function Even() {\n+ return <small>(even)<\/small>;\n+}\n+\n+\/\/ Simple stateful app shared by all React versions\n+class SimpleApp extends React.Component {\n+ state = { count: 0 };\n+ incrementCount = () => {\n+ const updaterFn = prevState => ({ count: prevState.count + 1 });\n+ trace('Updating count', performance.now(), () => this.setState(updaterFn));\n+ };\n+ render() {\n+ const { count } = this.state;\n+ return (\n+ <div>\n+ {count % 2 === 0 ? (\n+ <span>\n+ count: {count} <Even \/>\n+ <\/span>\n+ ) : (\n+ <span>count: {count}<\/span>\n+ )}{' '}\n+ <button onClick={this.incrementCount}>increment<\/button>\n+ <\/div>\n+ );\n+ }\n+}\n+apps.push(\n+ <Feature key=\"Simple stateful app\" label=\"Simple stateful app\" version=\"any\">\n+ <SimpleApp \/>\n+ <\/Feature>\n+);\n+\n+\/\/ This component, with the version prop, helps organize DevTools at a glance.\n+function TopLevelWrapperForDevTools({ version }) {\n+ let header = <h1>React {version}<\/h1>;\n+ if (version.includes('canary')) {\n+ const commitSha = version.match(\/.+canary-(.+)\/)[1];\n+ header = (\n+ <h1>\n+ React canary{' '}\n+ <a href={`https:\/\/github.com\/facebook\/react\/commit\/${commitSha}`}>\n+ {commitSha}\n+ <\/a>\n+ <\/h1>\n+ );\n+ } else if (version.includes('alpha')) {\n+ header = <h1>React next<\/h1>;\n+ }\n+\n+ return (\n+ <div>\n+ {header}\n+ {apps}\n+ <\/div>\n+ );\n+}\n+TopLevelWrapperForDevTools.displayName = 'React';\n+\n+ReactDOM.render(\n+ <TopLevelWrapperForDevTools version={React.version} \/>,\n+ document.getElementById('root')\n+);\ndiff --git a\/fixtures\/regression\/styles.css b\/fixtures\/regression\/styles.css\nnew file mode 100644\nindex 0000000000..6cbaaa5c01\n--- \/dev\/null\n+++ b\/fixtures\/regression\/styles.css\n@@ -0,0 +1,37 @@\n+body {\n+ font-family: sans-serif;\n+ font-size: 12px;\n+}\n+\n+h1 {\n+ margin: 0;\n+ font-size: 20px;\n+}\n+\n+h2 {\n+ margin: 1rem 0 0;\n+}\n+\n+iframe {\n+ border: 1px solid #ddd;\n+ border-radius: 0.5rem;\n+}\n+\n+code {\n+ white-space: nowrap;\n+}\n+\n+.Feature {\n+ margin: 1rem 0;\n+ border-bottom: 1px solid #eee;\n+ padding-bottom: 1rem;\n+}\n+.FeatureHeader {\n+ font-size: 16px;\n+ margin-bottom: 0.5rem;\n+}\n+.FeatureCode {\n+ background-color: #eee;\n+ padding: 0.25rem;\n+ border-radius: 0.25rem;\n+}\ndiff --git a\/flow-typed\/jest.js b\/flow-typed\/jest.js\nindex df83ee3ca3..8563e20d93 100644\n--- a\/flow-typed\/jest.js\n+++ b\/flow-typed\/jest.js\n@@ -133,11 +133,13 @@ type JestPromiseType = {\n * Use rejects to unwrap the reason of a rejected promise so any other\n * matcher can be chained. If the promise is fulfilled the assertion fails.\n *\/\n+ \/\/ eslint-disable-next-line no-use-before-define\n rejects: JestExpectType,\n \/**\n * Use resolves to unwrap the value of a fulfilled promise so any other\n * matcher can be chained. If the promise is rejected the assertion fails.\n *\/\n+ \/\/ eslint-disable-next-line no-use-before-define\n resolves: JestExpectType,\n };\n \n@@ -1085,8 +1087,10 @@ type JestPrettyFormatColors = {\n };\n \n type JestPrettyFormatIndent = string => string;\n+\/\/ eslint-disable-next-line no-unused-vars\n type JestPrettyFormatRefs = Array<any>;\n type JestPrettyFormatPrint = any => string;\n+\/\/ eslint-disable-next-line no-unused-vars\n type JestPrettyFormatStringOrNull = string | null;\n \n type JestPrettyFormatOptions = {|\n@@ -1097,6 +1101,7 @@ type JestPrettyFormatOptions = {|\n indent: number,\n maxDepth: number,\n min: boolean,\n+ \/\/ eslint-disable-next-line no-use-before-define\n plugins: JestPrettyFormatPlugins,\n printFunctionName: boolean,\n spacing: string,\ndiff --git a\/package.json b\/package.json\nindex 9e9dbc8332..f9bb136be5 100644\n--- a\/package.json\n+++ b\/package.json\n@@ -28,7 +28,7 @@\n \"<rootDir>\/src\/__tests__\/storeSerializer\"\n ],\n \"testMatch\": [\n- \"**\/__tests__\/*-test.js\"\n+ \"**\/__tests__\/**\/*-test.js\"\n ]\n },\n \"scripts\": {\n@@ -132,8 +132,10 @@\n \"prettier\": \"^1.16.4\",\n \"prop-types\": \"^15.6.2\",\n \"react\": \"^0.0.0-50b50c26f\",\n+ \"react-15\": \"npm:react@^15\",\n \"react-color\": \"^2.11.7\",\n \"react-dom\": \"^0.0.0-50b50c26f\",\n+ \"react-dom-15\": \"npm:react-dom@^15\",\n \"react-is\": \"^0.0.0-50b50c26f\",\n \"react-test-renderer\": \"^0.0.0-50b50c26f\",\n \"react-virtualized-auto-sizer\": \"^1.0.2\",\n@@ -142,6 +144,7 @@\n \"rimraf\": \"^2.6.3\",\n \"scheduler\": \"^0.0.0-50b50c26f\",\n \"semver\": \"^5.5.1\",\n+ \"serve-static\": \"^1.14.1\",\n \"style-loader\": \"^0.23.1\",\n \"web-ext\": \"^3.0.0\",\n \"webpack\": \"^4.26.0\",\ndiff --git a\/src\/__tests__\/legacy\/__snapshots__\/storeLegacy-v15-test.js.snap b\/src\/__tests__\/legacy\/__snapshots__\/storeLegacy-v15-test.js.snap\nnew file mode 100644\nindex 0000000000..d43112d058\n--- \/dev\/null\n+++ b\/src\/__tests__\/legacy\/__snapshots__\/storeLegacy-v15-test.js.snap\n@@ -0,0 +1,498 @@\n+\/\/ Jest Snapshot v1, https:\/\/goo.gl\/fbAQLP\n+\n+exports[`Store (legacy) collapseNodesByDefault:false should not filter DOM nodes from the store tree: 1: mount 1`] = `\n+[root]\n+ ▾ <Grandparent>\n+ ▾ <div>\n+ ▾ <div>\n+ ▾ <Parent>\n+ ▾ <div>\n+ ▾ <Child>\n+ <div>\n+ ▾ <Parent>\n+ ▾ <div>\n+ ▾ <Child>\n+ <div>\n+ <Nothing>\n+`;\n+\n+exports[`Store (legacy) collapseNodesByDefault:false should not filter DOM nodes from the store tree: 2: update 1`] = `\n+[root]\n+ ▾ <Grandparent>\n+ ▾ <div>\n+ ▾ <div>\n+ ▾ <Parent>\n+ ▾ <div>\n+ ▾ <Child>\n+ <div>\n+ ▾ <Parent>\n+ ▾ <div>\n+ ▾ <Child>\n+ <div>\n+ <Nothing>\n+`;\n+\n+exports[`Store (legacy) collapseNodesByDefault:false should not filter DOM nodes from the store tree: 5: unmount 1`] = ``;\n+\n+exports[`Store (legacy) collapseNodesByDefault:false should support adding and removing children: 1: mount 1`] = `\n+[root]\n+ ▾ <Root>\n+ ▾ <div>\n+ ▾ <Component key=\"a\">\n+ <div>\n+`;\n+\n+exports[`Store (legacy) collapseNodesByDefault:false should support adding and removing children: 2: add child 1`] = `\n+[root]\n+ ▾ <Root>\n+ ▾ <div>\n+ ▾ <Component key=\"a\">\n+ <div>\n+ ▾ <Component key=\"b\">\n+ <div>\n+`;\n+\n+exports[`Store (legacy) collapseNodesByDefault:false should support adding and removing children: 3: remove child 1`] = `\n+[root]\n+ ▾ <Root>\n+ ▾ <div>\n+ ▾ <Component key=\"b\">\n+ <div>\n+`;\n+\n+exports[`Store (legacy) collapseNodesByDefault:false should support collapsing parts of the tree: 1: mount 1`] = `\n+[root]\n+ ▾ <Grandparent>\n+ ▾ <div>\n+ ▾ <Parent>\n+ ▾ <div>\n+ ▾ <Child key=\"0\">\n+ <div>\n+ ▾ <Child key=\"1\">\n+ <div>\n+ ▾ <Parent>\n+ ▾ <div>\n+ ▾ <Child key=\"0\">\n+ <div>\n+ ▾ <Child key=\"1\">\n+ <div>\n+`;\n+\n+exports[`Store (legacy) collapseNodesByDefault:false should support collapsing parts of the tree: 2: collapse first Parent 1`] = `\n+[root]\n+ ▾ <Grandparent>\n+ ▾ <div>\n+ ▸ <Parent>\n+ ▾ <Parent>\n+ ▾ <div>\n+ ▾ <Child key=\"0\">\n+ <div>\n+ ▾ <Child key=\"1\">\n+ <div>\n+`;\n+\n+exports[`Store (legacy) collapseNodesByDefault:false should support collapsing parts of the tree: 3: collapse second Parent 1`] = `\n+[root]\n+ ▾ <Grandparent>\n+ ▾ <div>\n+ ▸ <Parent>\n+ ▸ <Parent>\n+`;\n+\n+exports[`Store (legacy) collapseNodesByDefault:false should support collapsing parts of the tree: 4: expand first Parent 1`] = `\n+[root]\n+ ▾ <Grandparent>\n+ ▾ <div>\n+ ▾ <Parent>\n+ ▾ <div>\n+ ▾ <Child key=\"0\">\n+ <div>\n+ ▾ <Child key=\"1\">\n+ <div>\n+ ▸ <Parent>\n+`;\n+\n+exports[`Store (legacy) collapseNodesByDefault:false should support collapsing parts of the tree: 5: collapse Grandparent 1`] = `\n+[root]\n+ ▸ <Grandparent>\n+`;\n+\n+exports[`Store (legacy) collapseNodesByDefault:false should support collapsing parts of the tree: 6: expand Grandparent 1`] = `\n+[root]\n+ ▾ <Grandparent>\n+ ▾ <div>\n+ ▾ <Parent>\n+ ▾ <div>\n+ ▾ <Child key=\"0\">\n+ <div>\n+ ▾ <Child key=\"1\">\n+ <div>\n+ ▸ <Parent>\n+`;\n+\n+exports[`Store (legacy) collapseNodesByDefault:false should support mount and update operations for multiple roots: 1: mount 1`] = `\n+[root]\n+ ▾ <Parent key=\"A\">\n+ ▾ <div>\n+ ▾ <Child key=\"0\">\n+ <div>\n+ ▾ <Child key=\"1\">\n+ <div>\n+ ▾ <Child key=\"2\">\n+ <div>\n+[root]\n+ ▾ <Parent key=\"B\">\n+ ▾ <div>\n+ ▾ <Child key=\"0\">\n+ <div>\n+ ▾ <Child key=\"1\">\n+ <div>\n+`;\n+\n+exports[`Store (legacy) collapseNodesByDefault:false should support mount and update operations for multiple roots: 2: update 1`] = `\n+[root]\n+ ▾ <Parent key=\"A\">\n+ ▾ <div>\n+ ▾ <Child key=\"0\">\n+ <div>\n+ ▾ <Child key=\"1\">\n+ <div>\n+ ▾ <Child key=\"2\">\n+ <div>\n+ ▾ <Child key=\"3\">\n+ <div>\n+[root]\n+ ▾ <Parent key=\"B\">\n+ ▾ <div>\n+ ▾ <Child key=\"0\">\n+ <div>\n+`;\n+\n+exports[`Store (legacy) collapseNodesByDefault:false should support mount and update operations for multiple roots: 3: unmount B 1`] = `\n+[root]\n+ ▾ <Parent key=\"A\">\n+ ▾ <div>\n+ ▾ <Child key=\"0\">\n+ <div>\n+ ▾ <Child key=\"1\">\n+ <div>\n+ ▾ <Child key=\"2\">\n+ <div>\n+ ▾ <Child key=\"3\">\n+ <div>\n+`;\n+\n+exports[`Store (legacy) collapseNodesByDefault:false should support mount and update operations for multiple roots: 4: unmount A 1`] = ``;\n+\n+exports[`Store (legacy) collapseNodesByDefault:false should support mount and update operations: 1: mount 1`] = `\n+[root]\n+ ▾ <Grandparent>\n+ ▾ <div>\n+ ▾ <Parent>\n+ ▾ <div>\n+ ▾ <Child key=\"0\">\n+ <div>\n+ ▾ <Child key=\"1\">\n+ <div>\n+ ▾ <Child key=\"2\">\n+ <div>\n+ ▾ <Child key=\"3\">\n+ <div>\n+ ▾ <Parent>\n+ ▾ <div>\n+ ▾ <Child key=\"0\">\n+ <div>\n+ ▾ <Child key=\"1\">\n+ <div>\n+ ▾ <Child key=\"2\">\n+ <div>\n+ ▾ <Child key=\"3\">\n+ <div>\n+`;\n+\n+exports[`Store (legacy) collapseNodesByDefault:false should support mount and update operations: 2: update 1`] = `\n+[root]\n+ ▾ <Grandparent>\n+ ▾ <div>\n+ ▾ <Parent>\n+ ▾ <div>\n+ ▾ <Child key=\"0\">\n+ <div>\n+ ▾ <Child key=\"1\">\n+ <div>\n+ ▾ <Parent>\n+ ▾ <div>\n+ ▾ <Child key=\"0\">\n+ <div>\n+ ▾ <Child key=\"1\">\n+ <div>\n+`;\n+\n+exports[`Store (legacy) collapseNodesByDefault:false should support mount and update operations: 3: unmount 1`] = ``;\n+\n+exports[`Store (legacy) collapseNodesByDefault:false should support reordering of children: 1: mount 1`] = `\n+[root]\n+ ▾ <Root>\n+ ▾ <div>\n+ ▾ <Foo key=\"foo\">\n+ ▾ <div>\n+ ▾ <Component key=\"0\">\n+ <div>\n+ ▾ <Bar key=\"bar\">\n+ ▾ <div>\n+ ▾ <Component key=\"0\">\n+ <div>\n+ ▾ <Component key=\"1\">\n+ <div>\n+`;\n+\n+exports[`Store (legacy) collapseNodesByDefault:false should support reordering of children: 2: reorder children 1`] = `\n+[root]\n+ ▾ <Root>\n+ ▾ <div>\n+ ▾ <Bar key=\"bar\">\n+ ▾ <div>\n+ ▾ <Component key=\"0\">\n+ <div>\n+ ▾ <Component key=\"1\">\n+ <div>\n+ ▾ <Foo key=\"foo\">\n+ ▾ <div>\n+ ▾ <Component key=\"0\">\n+ <div>\n+`;\n+\n+exports[`Store (legacy) collapseNodesByDefault:false should support reordering of children: 3: collapse root 1`] = `\n+[root]\n+ ▸ <Root>\n+`;\n+\n+exports[`Store (legacy) collapseNodesByDefault:false should support reordering of children: 4: expand root 1`] = `\n+[root]\n+ ▾ <Root>\n+ ▾ <div>\n+ ▾ <Bar key=\"bar\">\n+ ▾ <div>\n+ ▾ <Component key=\"0\">\n+ <div>\n+ ▾ <Component key=\"1\">\n+ <div>\n+ ▾ <Foo key=\"foo\">\n+ ▾ <div>\n+ ▾ <Component key=\"0\">\n+ <div>\n+`;\n+\n+exports[`Store (legacy) collapseNodesByDefault:true should not filter DOM nodes from the store tree: 1: mount 1`] = `\n+[root]\n+ ▸ <Grandparent>\n+`;\n+\n+exports[`Store (legacy) collapseNodesByDefault:true should not filter DOM nodes from the store tree: 2: expand Grandparent 1`] = `\n+[root]\n+ ▾ <Grandparent>\n+ ▸ <div>\n+`;\n+\n+exports[`Store (legacy) collapseNodesByDefault:true should not filter DOM nodes from the store tree: 3: expand div 1`] = `\n+[root]\n+ ▾ <Grandparent>\n+ ▾ <div>\n+ ▸ <div>\n+ ▸ <Parent>\n+ <Nothing>\n+`;\n+\n+exports[`Store (legacy) collapseNodesByDefault:true should not filter DOM nodes from the store tree: 4: final update 1`] = `\n+[root]\n+ ▾ <Grandparent>\n+ ▾ <div>\n+ ▸ <div>\n+ ▸ <Parent>\n+ <Nothing>\n+`;\n+\n+exports[`Store (legacy) collapseNodesByDefault:true should not filter DOM nodes from the store tree: 5: unmount 1`] = ``;\n+\n+exports[`Store (legacy) collapseNodesByDefault:true should support expanding deep parts of the tree: 1: mount 1`] = `\n+[root]\n+ ▸ <Wrapper>\n+`;\n+\n+exports[`Store (legacy) collapseNodesByDefault:true should support expanding deep parts of the tree: 2: expand deepest node 1`] = `\n+[root]\n+ ▾ <Wrapper>\n+ ▾ <Nested>\n+ ▾ <Nested>\n+ ▾ <Nested>\n+ ▾ <Nested>\n+ <div>\n+`;\n+\n+exports[`Store (legacy) collapseNodesByDefault:true should support expanding deep parts of the tree: 3: collapse root 1`] = `\n+[root]\n+ ▸ <Wrapper>\n+`;\n+\n+exports[`Store (legacy) collapseNodesByDefault:true should support expanding deep parts of the tree: 4: expand root 1`] = `\n+[root]\n+ ▾ <Wrapper>\n+ ▾ <Nested>\n+ ▾ <Nested>\n+ ▾ <Nested>\n+ ▾ <Nested>\n+ <div>\n+`;\n+\n+exports[`Store (legacy) collapseNodesByDefault:true should support expanding deep parts of the tree: 5: collapse middle node 1`] = `\n+[root]\n+ ▾ <Wrapper>\n+ ▸ <Nested>\n+`;\n+\n+exports[`Store (legacy) collapseNodesByDefault:true should support expanding deep parts of the tree: 6: expand middle node 1`] = `\n+[root]\n+ ▾ <Wrapper>\n+ ▾ <Nested>\n+ ▾ <Nested>\n+ ▾ <Nested>\n+ ▾ <Nested>\n+ <div>\n+`;\n+\n+exports[`Store (legacy) collapseNodesByDefault:true should support expanding parts of the tree: 1: mount 1`] = `\n+[root]\n+ ▸ <Grandparent>\n+`;\n+\n+exports[`Store (legacy) collapseNodesByDefault:true should support expanding parts of the tree: 2: expand Grandparent 1`] = `\n+[root]\n+ ▾ <Grandparent>\n+ ▸ <div>\n+`;\n+\n+exports[`Store (legacy) collapseNodesByDefault:true should support expanding parts of the tree: 3: expand parent div 1`] = `\n+[root]\n+ ▾ <Grandparent>\n+ ▾ <div>\n+ ▸ <Parent>\n+ ▸ <Parent>\n+`;\n+\n+exports[`Store (legacy) collapseNodesByDefault:true should support expanding parts of the tree: 4: expand first Parent 1`] = `\n+[root]\n+ ▾ <Grandparent>\n+ ▾ <div>\n+ ▾ <Parent>\n+ ▸ <div>\n+ ▸ <Parent>\n+`;\n+\n+exports[`Store (legacy) collapseNodesByDefault:true should support expanding parts of the tree: 5: expand second Parent 1`] = `\n+[root]\n+ ▾ <Grandparent>\n+ ▾ <div>\n+ ▾ <Parent>\n+ ▸ <div>\n+ ▾ <Parent>\n+ ▸ <div>\n+`;\n+\n+exports[`Store (legacy) collapseNodesByDefault:true should support expanding parts of the tree: 6: collapse first Parent 1`] = `\n+[root]\n+ ▾ <Grandparent>\n+ ▾ <div>\n+ ▸ <Parent>\n+ ▾ <Parent>\n+ ▸ <div>\n+`;\n+\n+exports[`Store (legacy) collapseNodesByDefault:true should support expanding parts of the tree: 7: collapse second Parent 1`] = `\n+[root]\n+ ▾ <Grandparent>\n+ ▾ <div>\n+ ▸ <Parent>\n+ ▸ <Parent>\n+`;\n+\n+exports[`Store (legacy) collapseNodesByDefault:true should support expanding parts of the tree: 8: collapse Grandparent 1`] = `\n+[root]\n+ ▸ <Grandparent>\n+`;\n+\n+exports[`Store (legacy) collapseNodesByDefault:true should support mount and update operations for multiple roots: 1: mount 1`] = `\n+[root]\n+ ▸ <Parent key=\"A\">\n+[root]\n+ ▸ <Parent key=\"B\">\n+`;\n+\n+exports[`Store (legacy) collapseNodesByDefault:true should support mount and update operations for multiple roots: 2: update 1`] = `\n+[root]\n+ ▸ <Parent key=\"A\">\n+[root]\n+ ▸ <Parent key=\"B\">\n+`;\n+\n+exports[`Store (legacy) collapseNodesByDefault:true should support mount and update operations for multiple roots: 3: unmount B 1`] = `\n+[root]\n+ ▸ <Parent key=\"A\">\n+`;\n+\n+exports[`Store (legacy) collapseNodesByDefault:true should support mount and update operations for multiple roots: 4: unmount A 1`] = ``;\n+\n+exports[`Store (legacy) collapseNodesByDefault:true should support mount and update operations: 1: mount 1`] = `\n+[root]\n+ ▸ <div>\n+`;\n+\n+exports[`Store (legacy) collapseNodesByDefault:true should support mount and update operations: 2: update 1`] = `\n+[root]\n+ ▸ <div>\n+`;\n+\n+exports[`Store (legacy) collapseNodesByDefault:true should support mount and update operations: 3: unmount 1`] = ``;\n+\n+exports[`Store (legacy) collapseNodesByDefault:true should support reordering of children: 1: mount 1`] = `\n+[root]\n+ ▸ <Root>\n+`;\n+\n+exports[`Store (legacy) collapseNodesByDefault:true should support reordering of children: 2: reorder children 1`] = `\n+[root]\n+ ▸ <Root>\n+`;\n+\n+exports[`Store (legacy) collapseNodesByDefault:true should support reordering of children: 3: expand root 1`] = `\n+[root]\n+ ▾ <Root>\n+ ▸ <div>\n+`;\n+\n+exports[`Store (legacy) collapseNodesByDefault:true should support reordering of children: 4: expand div 1`] = `\n+[root]\n+ ▾ <Root>\n+ ▾ <div>\n+ ▸ <Bar key=\"bar\">\n+ ▸ <Foo key=\"foo\">\n+`;\n+\n+exports[`Store (legacy) collapseNodesByDefault:true should support reordering of children: 4: expand leaves 1`] = `\n+[root]\n+ ▾ <Root>\n+ ▾ <div>\n+ ▾ <Bar key=\"bar\">\n+ ▸ <div>\n+ ▾ <Foo key=\"foo\">\n+ ▸ <div>\n+`;\n+\n+exports[`Store (legacy) collapseNodesByDefault:true should support reordering of children: 5: collapse root 1`] = `\n+[root]\n+ ▸ <Root>\n+`;\n+\n+exports[`Store (legacy) should not allow a root node to be collapsed: 1: mount 1`] = `\n+[root]\n+ ▸ <Component>\n+`;\ndiff --git a\/src\/__tests__\/legacy\/storeLegacy-v15-test.js b\/src\/__tests__\/legacy\/storeLegacy-v15-test.js\nnew file mode 100644\nindex 0000000000..fc5d373e5b\n--- \/dev\/null\n+++ b\/src\/__tests__\/legacy\/storeLegacy-v15-test.js\n@@ -0,0 +1,505 @@\n+\/\/ @flow\n+\n+describe('Store (legacy)', () => {\n+ let React;\n+ let ReactDOM;\n+ let store;\n+\n+ const act = (callback: Function) => {\n+ callback();\n+\n+ jest.runAllTimers(); \/\/ Flush Bridge operations\n+ };\n+\n+ beforeEach(() => {\n+ store = global.store;\n+\n+ \/\/ Redirect all React\/ReactDOM requires to the v15 UMD.\n+ \/\/ We use the UMD because Jest doesn't enable us to mock deep imports (e.g. \"react\/lib\/Something\").\n+ jest.mock('react', () => jest.requireActual('react-15\/dist\/react.js'));\n+ jest.mock('react-dom', () =>\n+ jest.requireActual('react-dom-15\/dist\/react-dom.js')\n+ );\n+\n+ React = require('react');\n+ ReactDOM = require('react-dom');\n+ });\n+\n+ it('should not allow a root node to be collapsed', () => {\n+ const Component = () => <div>Hi<\/div>;\n+\n+ act(() =>\n+ ReactDOM.render(<Component count={4} \/>, document.createElement('div'))\n+ );\n+ expect(store).toMatchSnapshot('1: mount');\n+\n+ expect(store.roots).toHaveLength(1);\n+\n+ const rootID = store.roots[0];\n+\n+ expect(() => store.toggleIsCollapsed(rootID, true)).toThrow(\n+ 'Root nodes cannot be collapsed'\n+ );\n+ });\n+\n+ describe('collapseNodesByDefault:false', () => {\n+ beforeEach(() => {\n+ store.collapseNodesByDefault = false;\n+ });\n+\n+ it('should support mount and update operations', () => {\n+ const Grandparent = ({ count }) => (\n+ <div>\n+ <Parent count={count} \/>\n+ <Parent count={count} \/>\n+ <\/div>\n+ );\n+ const Parent = ({ count }) => (\n+ <div>\n+ {new Array(count).fill(true).map((_, index) => (\n+ <Child key={index} \/>\n+ ))}\n+ <\/div>\n+ );\n+ const Child = () => <div>Hi!<\/div>;\n+\n+ const container = document.createElement('div');\n+\n+ act(() => ReactDOM.render(<Grandparent count={4} \/>, container));\n+ expect(store).toMatchSnapshot('1: mount');\n+\n+ act(() => ReactDOM.render(<Grandparent count={2} \/>, container));\n+ expect(store).toMatchSnapshot('2: update');\n+\n+ act(() => ReactDOM.unmountComponentAtNode(container));\n+ expect(store).toMatchSnapshot('3: unmount');\n+ });\n+\n+ it('should support mount and update operations for multiple roots', () => {\n+ const Parent = ({ count }) => (\n+ <div>\n+ {new Array(count).fill(true).map((_, index) => (\n+ <Child key={index} \/>\n+ ))}\n+ <\/div>\n+ );\n+ const Child = () => <div>Hi!<\/div>;\n+\n+ const containerA = document.createElement('div');\n+ const containerB = document.createElement('div');\n+\n+ act(() => {\n+ ReactDOM.render(<Parent key=\"A\" count={3} \/>, containerA);\n+ ReactDOM.render(<Parent key=\"B\" count={2} \/>, containerB);\n+ });\n+ expect(store).toMatchSnapshot('1: mount');\n+\n+ act(() => {\n+ ReactDOM.render(<Parent key=\"A\" count={4} \/>, containerA);\n+ ReactDOM.render(<Parent key=\"B\" count={1} \/>, containerB);\n+ });\n+ expect(store).toMatchSnapshot('2: update');\n+\n+ act(() => ReactDOM.unmountComponentAtNode(containerB));\n+ expect(store).toMatchSnapshot('3: unmount B');\n+\n+ act(() => ReactDOM.unmountComponentAtNode(containerA));\n+ expect(store).toMatchSnapshot('4: unmount A');\n+ });\n+\n+ it('should not filter DOM nodes from the store tree', () => {\n+ const Grandparent = ({ flip }) => (\n+ <div>\n+ <div>\n+ <Parent flip={flip} \/>\n+ <\/div>\n+ <Parent flip={flip} \/>\n+ <Nothing \/>\n+ <\/div>\n+ );\n+ const Parent = ({ flip }) => (\n+ <div>\n+ {flip ? 'foo' : null}\n+ <Child \/>\n+ {flip && [null, 'hello', 42]}\n+ {flip ? 'bar' : 'baz'}\n+ <\/div>\n+ );\n+ const Child = () => <div>Hi!<\/div>;\n+ const Nothing = () => null;\n+\n+ const container = document.createElement('div');\n+ act(() =>\n+ ReactDOM.render(<Grandparent count={4} flip={false} \/>, container)\n+ );\n+ expect(store).toMatchSnapshot('1: mount');\n+\n+ act(() =>\n+ ReactDOM.render(<Grandparent count={4} flip={true} \/>, container)\n+ );\n+ expect(store).toMatchSnapshot('2: update');\n+\n+ act(() => ReactDOM.unmountComponentAtNode(container));\n+ expect(store).toMatchSnapshot('5: unmount');\n+ });\n+\n+ it('should support collapsing parts of the tree', () => {\n+ const Grandparent = ({ count }) => (\n+ <div>\n+ <Parent count={count} \/>\n+ <Parent count={count} \/>\n+ <\/div>\n+ );\n+ const Parent = ({ count }) => (\n+ <div>\n+ {new Array(count).fill(true).map((_, index) => (\n+ <Child key={index} \/>\n+ ))}\n+ <\/div>\n+ );\n+ const Child = () => <div>Hi!<\/div>;\n+\n+ act(() =>\n+ ReactDOM.render(\n+ <Grandparent count={2} \/>,\n+ document.createElement('div')\n+ )\n+ );\n+ expect(store).toMatchSnapshot('1: mount');\n+\n+ const grandparentID = store.getElementIDAtIndex(0);\n+ const parentOneID = store.getElementIDAtIndex(2);\n+ const parentTwoID = store.getElementIDAtIndex(8);\n+\n+ act(() => store.toggleIsCollapsed(parentOneID, true));\n+ expect(store).toMatchSnapshot('2: collapse first Parent');\n+\n+ act(() => store.toggleIsCollapsed(parentTwoID, true));\n+ expect(store).toMatchSnapshot('3: collapse second Parent');\n+\n+ act(() => store.toggleIsCollapsed(parentOneID, false));\n+ expect(store).toMatchSnapshot('4: expand first Parent');\n+\n+ act(() => store.toggleIsCollapsed(grandparentID, true));\n+ expect(store).toMatchSnapshot('5: collapse Grandparent');\n+\n+ act(() => store.toggleIsCollapsed(grandparentID, false));\n+ expect(store).toMatchSnapshot('6: expand Grandparent');\n+ });\n+\n+ it('should support adding and removing children', () => {\n+ const Root = ({ children }) => <div>{children}<\/div>;\n+ const Component = () => <div \/>;\n+\n+ const container = document.createElement('div');\n+\n+ act(() =>\n+ ReactDOM.render(\n+ <Root>\n+ <Component key=\"a\" \/>\n+ <\/Root>,\n+ container\n+ )\n+ );\n+ expect(store).toMatchSnapshot('1: mount');\n+\n+ act(() =>\n+ ReactDOM.render(\n+ <Root>\n+ <Component key=\"a\" \/>\n+ <Component key=\"b\" \/>\n+ <\/Root>,\n+ container\n+ )\n+ );\n+ expect(store).toMatchSnapshot('2: add child');\n+\n+ act(() =>\n+ ReactDOM.render(\n+ <Root>\n+ <Component key=\"b\" \/>\n+ <\/Root>,\n+ container\n+ )\n+ );\n+ expect(store).toMatchSnapshot('3: remove child');\n+ });\n+\n+ it('should support reordering of children', () => {\n+ const Root = ({ children }) => <div>{children}<\/div>;\n+ const Component = () => <div \/>;\n+\n+ const Foo = () => <div>{[<Component key=\"0\" \/>]}<\/div>;\n+ const Bar = () => (\n+ <div>{[<Component key=\"0\" \/>, <Component key=\"1\" \/>]}<\/div>\n+ );\n+ const foo = <Foo key=\"foo\" \/>;\n+ const bar = <Bar key=\"bar\" \/>;\n+\n+ const container = document.createElement('div');\n+\n+ act(() => ReactDOM.render(<Root>{[foo, bar]}<\/Root>, container));\n+ expect(store).toMatchSnapshot('1: mount');\n+\n+ act(() => ReactDOM.render(<Root>{[bar, foo]}<\/Root>, container));\n+ expect(store).toMatchSnapshot('2: reorder children');\n+\n+ act(() => store.toggleIsCollapsed(store.getElementIDAtIndex(0), true));\n+ expect(store).toMatchSnapshot('3: collapse root');\n+\n+ act(() => store.toggleIsCollapsed(store.getElementIDAtIndex(0), false));\n+ expect(store).toMatchSnapshot('4: expand root');\n+ });\n+ });\n+\n+ describe('collapseNodesByDefault:true', () => {\n+ beforeEach(() => {\n+ store.collapseNodesByDefault = true;\n+ });\n+\n+ it('should support mount and update operations', () => {\n+ const Parent = ({ count }) => (\n+ <div>\n+ {new Array(count).fill(true).map((_, index) => (\n+ <Child key={index} \/>\n+ ))}\n+ <\/div>\n+ );\n+ const Child = () => <div>Hi!<\/div>;\n+\n+ const container = document.createElement('div');\n+\n+ act(() =>\n+ ReactDOM.render(\n+ <div>\n+ <Parent count={1} \/>\n+ <Parent count={3} \/>\n+ <\/div>,\n+ container\n+ )\n+ );\n+ expect(store).toMatchSnapshot('1: mount');\n+\n+ act(() =>\n+ ReactDOM.render(\n+ <div>\n+ <Parent count={2} \/>\n+ <Parent count={1} \/>\n+ <\/div>,\n+ container\n+ )\n+ );\n+ expect(store).toMatchSnapshot('2: update');\n+\n+ act(() => ReactDOM.unmountComponentAtNode(container));\n+ expect(store).toMatchSnapshot('3: unmount');\n+ });\n+\n+ it('should support mount and update operations for multiple roots', () => {\n+ const Parent = ({ count }) => (\n+ <div>\n+ {new Array(count).fill(true).map((_, index) => (\n+ <Child key={index} \/>\n+ ))}\n+ <\/div>\n+ );\n+ const Child = () => <div>Hi!<\/div>;\n+\n+ const containerA = document.createElement('div');\n+ const containerB = document.createElement('div');\n+\n+ act(() => {\n+ ReactDOM.render(<Parent key=\"A\" count={3} \/>, containerA);\n+ ReactDOM.render(<Parent key=\"B\" count={2} \/>, containerB);\n+ });\n+ expect(store).toMatchSnapshot('1: mount');\n+\n+ act(() => {\n+ ReactDOM.render(<Parent key=\"A\" count={4} \/>, containerA);\n+ ReactDOM.render(<Parent key=\"B\" count={1} \/>, containerB);\n+ });\n+ expect(store).toMatchSnapshot('2: update');\n+\n+ act(() => ReactDOM.unmountComponentAtNode(containerB));\n+ expect(store).toMatchSnapshot('3: unmount B');\n+\n+ act(() => ReactDOM.unmountComponentAtNode(containerA));\n+ expect(store).toMatchSnapshot('4: unmount A');\n+ });\n+\n+ it('should not filter DOM nodes from the store tree', () => {\n+ const Grandparent = ({ flip }) => (\n+ <div>\n+ <div>\n+ <Parent flip={flip} \/>\n+ <\/div>\n+ <Parent flip={flip} \/>\n+ <Nothing \/>\n+ <\/div>\n+ );\n+ const Parent = ({ flip }) => (\n+ <div>\n+ {flip ? 'foo' : null}\n+ <Child \/>\n+ {flip && [null, 'hello', 42]}\n+ {flip ? 'bar' : 'baz'}\n+ <\/div>\n+ );\n+ const Child = () => <div>Hi!<\/div>;\n+ const Nothing = () => null;\n+\n+ const container = document.createElement('div');\n+ act(() =>\n+ ReactDOM.render(<Grandparent count={4} flip={false} \/>, container)\n+ );\n+ expect(store).toMatchSnapshot('1: mount');\n+\n+ act(() => store.toggleIsCollapsed(store.getElementIDAtIndex(0), false));\n+ expect(store).toMatchSnapshot('2: expand Grandparent');\n+\n+ act(() => store.toggleIsCollapsed(store.getElementIDAtIndex(1), false));\n+ expect(store).toMatchSnapshot('3: expand div');\n+\n+ act(() =>\n+ ReactDOM.render(<Grandparent count={4} flip={true} \/>, container)\n+ );\n+ expect(store).toMatchSnapshot('4: final update');\n+\n+ act(() => ReactDOM.unmountComponentAtNode(container));\n+ expect(store).toMatchSnapshot('5: unmount');\n+ });\n+\n+ it('should support expanding parts of the tree', () => {\n+ const Grandparent = ({ count }) => (\n+ <div>\n+ <Parent count={count} \/>\n+ <Parent count={count} \/>\n+ <\/div>\n+ );\n+ const Parent = ({ count }) => (\n+ <div>\n+ {new Array(count).fill(true).map((_, index) => (\n+ <Child key={index} \/>\n+ ))}\n+ <\/div>\n+ );\n+ const Child = () => <div>Hi!<\/div>;\n+\n+ act(() =>\n+ ReactDOM.render(\n+ <Grandparent count={2} \/>,\n+ document.createElement('div')\n+ )\n+ );\n+ expect(store).toMatchSnapshot('1: mount');\n+\n+ const grandparentID = store.getElementIDAtIndex(0);\n+\n+ act(() => store.toggleIsCollapsed(grandparentID, false));\n+ expect(store).toMatchSnapshot('2: expand Grandparent');\n+\n+ const parentDivID = store.getElementIDAtIndex(1);\n+ act(() => store.toggleIsCollapsed(parentDivID, false));\n+ expect(store).toMatchSnapshot('3: expand parent div');\n+\n+ const parentOneID = store.getElementIDAtIndex(2);\n+ const parentTwoID = store.getElementIDAtIndex(3);\n+\n+ act(() => store.toggleIsCollapsed(parentOneID, false));\n+ expect(store).toMatchSnapshot('4: expand first Parent');\n+\n+ act(() => store.toggleIsCollapsed(parentTwoID, false));\n+ expect(store).toMatchSnapshot('5: expand second Parent');\n+\n+ act(() => store.toggleIsCollapsed(parentOneID, true));\n+ expect(store).toMatchSnapshot('6: collapse first Parent');\n+\n+ act(() => store.toggleIsCollapsed(parentTwoID, true));\n+ expect(store).toMatchSnapshot('7: collapse second Parent');\n+\n+ act(() => store.toggleIsCollapsed(grandparentID, true));\n+ expect(store).toMatchSnapshot('8: collapse Grandparent');\n+ });\n+\n+ it('should support expanding deep parts of the tree', () => {\n+ const Wrapper = ({ forwardedRef }) => (\n+ <Nested depth={3} forwardedRef={forwardedRef} \/>\n+ );\n+ const Nested = ({ depth, forwardedRef }) =>\n+ depth > 0 ? (\n+ <Nested depth={depth - 1} forwardedRef={forwardedRef} \/>\n+ ) : (\n+ <div ref={forwardedRef} \/>\n+ );\n+\n+ let ref = null;\n+ const refSetter = value => {\n+ ref = value;\n+ };\n+\n+ act(() =>\n+ ReactDOM.render(\n+ <Wrapper forwardedRef={refSetter} \/>,\n+ document.createElement('div')\n+ )\n+ );\n+ expect(store).toMatchSnapshot('1: mount');\n+\n+ const deepestedNodeID = global.agent.getIDForNode(ref);\n+\n+ act(() => store.toggleIsCollapsed(deepestedNodeID, false));\n+ expect(store).toMatchSnapshot('2: expand deepest node');\n+\n+ const rootID = store.getElementIDAtIndex(0);\n+\n+ act(() => store.toggleIsCollapsed(rootID, true));\n+ expect(store).toMatchSnapshot('3: collapse root');\n+\n+ act(() => store.toggleIsCollapsed(rootID, false));\n+ expect(store).toMatchSnapshot('4: expand root');\n+\n+ const id = store.getElementIDAtIndex(1);\n+\n+ act(() => store.toggleIsCollapsed(id, true));\n+ expect(store).toMatchSnapshot('5: collapse middle node');\n+\n+ act(() => store.toggleIsCollapsed(id, false));\n+ expect(store).toMatchSnapshot('6: expand middle node');\n+ });\n+\n+ it('should support reordering of children', () => {\n+ const Root = ({ children }) => <div>{children}<\/div>;\n+ const Component = () => <div \/>;\n+\n+ const Foo = () => <div>{[<Component key=\"0\" \/>]}<\/div>;\n+ const Bar = () => (\n+ <div>{[<Component key=\"0\" \/>, <Component key=\"1\" \/>]}<\/div>\n+ );\n+ const foo = <Foo key=\"foo\" \/>;\n+ const bar = <Bar key=\"bar\" \/>;\n+\n+ const container = document.createElement('div');\n+\n+ act(() => ReactDOM.render(<Root>{[foo, bar]}<\/Root>, container));\n+ expect(store).toMatchSnapshot('1: mount');\n+\n+ act(() => ReactDOM.render(<Root>{[bar, foo]}<\/Root>, container));\n+ expect(store).toMatchSnapshot('2: reorder children');\n+\n+ act(() => store.toggleIsCollapsed(store.getElementIDAtIndex(0), false));\n+ expect(store).toMatchSnapshot('3: expand root');\n+\n+ act(() => store.toggleIsCollapsed(store.getElementIDAtIndex(1), false));\n+ expect(store).toMatchSnapshot('4: expand div');\n+\n+ act(() => {\n+ store.toggleIsCollapsed(store.getElementIDAtIndex(3), false);\n+ store.toggleIsCollapsed(store.getElementIDAtIndex(2), false);\n+ });\n+ expect(store).toMatchSnapshot('4: expand leaves');\n+\n+ act(() => store.toggleIsCollapsed(store.getElementIDAtIndex(0), true));\n+ expect(store).toMatchSnapshot('5: collapse root');\n+ });\n+ });\n+});\ndiff --git a\/src\/__tests__\/utils.js b\/src\/__tests__\/utils.js\nindex 57fb2de3d3..089ddf045f 100644\n--- a\/src\/__tests__\/utils.js\n+++ b\/src\/__tests__\/utils.js\n@@ -47,17 +47,15 @@ export async function actAsync(\n \n export function beforeEachProfiling(): void {\n \/\/ Mock React's timing information so that test runs are predictable.\n- jest.mock('scheduler', () =>\n- \/\/ $FlowFixMe Flow does not konw about requireActual\n- require.requireActual('scheduler\/unstable_mock')\n- );\n+ jest.mock('scheduler', () => jest.requireActual('scheduler\/unstable_mock'));\n \n \/\/ DevTools itself uses performance.now() to offset commit times\n \/\/ so they appear relative to when profiling was started in the UI.\n- jest.spyOn(performance, 'now').mockImplementation(\n- \/\/ $FlowFixMe Flow does not konw about requireActual\n- require.requireActual('scheduler\/unstable_mock').unstable_now\n- );\n+ jest\n+ .spyOn(performance, 'now')\n+ .mockImplementation(\n+ jest.requireActual('scheduler\/unstable_mock').unstable_now\n+ );\n }\n \n export function createDisplayNameFilter(\ndiff --git a\/src\/backend\/index.js b\/src\/backend\/index.js\nindex 58045bc0a2..3e65e4c00c 100644\n--- a\/src\/backend\/index.js\n+++ b\/src\/backend\/index.js\n@@ -4,6 +4,7 @@ import type { DevToolsHook, ReactRenderer, RendererInterface } from '.\/types';\n import Agent from '.\/agent';\n \n import { attach } from '.\/renderer';\n+import { attach as attachLegacy } from '.\/legacy\/renderer';\n \n export function initBackend(\n hook: DevToolsHook,\n@@ -40,7 +41,11 @@ export function initBackend(\n \n \/\/ Inject any not-yet-injected renderers (if we didn't reload-and-profile)\n if (!rendererInterface) {\n- rendererInterface = attach(hook, id, renderer, global);\n+ if (typeof renderer.findFiberByHostInstance === 'function') {\n+ rendererInterface = attach(hook, id, renderer, global);\n+ } else {\n+ rendererInterface = attachLegacy(hook, id, renderer, global);\n+ }\n \n hook.rendererInterfaces.set(id, rendererInterface);\n }\ndiff --git a\/src\/backend\/legacy\/getData.js b\/src\/backend\/legacy\/getData.js\nnew file mode 100644\nindex 0000000000..d2fce307d3\n--- \/dev\/null\n+++ b\/src\/backend\/legacy\/getData.js\n@@ -0,0 +1,40 @@\n+\/\/ @flow\n+\n+import {\n+ ElementTypeClass,\n+ ElementTypeHostComponent,\n+ ElementTypeOtherOrUnknown,\n+} from 'src\/types';\n+import { getDisplayName } from 'src\/utils';\n+\n+import type { InternalInstance } from '.\/renderer';\n+import type { FiberData } from '..\/types';\n+\n+export default function getData(internalInstance: InternalInstance): FiberData {\n+ let displayName = null;\n+ let key = null;\n+ let type = ElementTypeOtherOrUnknown;\n+\n+ \/\/ != used deliberately here to catch undefined and null\n+ if (internalInstance._currentElement != null) {\n+ if (internalInstance._currentElement.key) {\n+ key = String(internalInstance._currentElement.key);\n+ }\n+\n+ const elementType = internalInstance._currentElement.type;\n+ if (typeof elementType === 'string') {\n+ type = ElementTypeHostComponent;\n+ displayName = elementType;\n+ } else if (typeof elementType === 'function') {\n+ \/\/ TODO: detect function components.\n+ type = ElementTypeClass;\n+ displayName = getDisplayName(elementType);\n+ }\n+ }\n+\n+ return {\n+ displayName,\n+ key,\n+ type,\n+ };\n+}\ndiff --git a\/src\/backend\/legacy\/renderer.js b\/src\/backend\/legacy\/renderer.js\nnew file mode 100644\nindex 0000000000..5ea0a9fb95\n--- \/dev\/null\n+++ b\/src\/backend\/legacy\/renderer.js\n@@ -0,0 +1,791 @@\n+\/\/ @flow\n+\n+import {\n+ ElementTypeClass,\n+ ElementTypeFunction,\n+ ElementTypeRoot,\n+ ElementTypeHostComponent,\n+ ElementTypeOtherOrUnknown,\n+} from 'src\/types';\n+import { getUID, utfEncodeString, printOperationsArray } from '..\/..\/utils';\n+import { cleanForBridge, copyWithSet } from '..\/utils';\n+import {\n+ __DEBUG__,\n+ TREE_OPERATION_ADD,\n+ TREE_OPERATION_REMOVE,\n+ TREE_OPERATION_REORDER_CHILDREN,\n+} from '..\/..\/constants';\n+import getData from '.\/getData';\n+import { decorateMany, forceUpdate, restoreMany } from '.\/utils';\n+\n+import type {\n+ DevToolsHook,\n+ GetFiberIDForNative,\n+ NativeType,\n+ PathFrame,\n+ PathMatch,\n+ RendererInterface,\n+} from '..\/types';\n+import type { ComponentFilter, ElementType } from 'src\/types';\n+import type { Owner, InspectedElement } from '..\/types';\n+\n+export type InternalInstance = Object;\n+type LegacyRenderer = Object;\n+\n+function getElementType(internalInstance: InternalInstance): ElementType {\n+ \/\/ != used deliberately here to catch undefined and null\n+ if (internalInstance._currentElement != null) {\n+ const elementType = internalInstance._currentElement.type;\n+ if (typeof elementType === 'function') {\n+ return ElementTypeClass;\n+ } else if (typeof elementType === 'string') {\n+ return ElementTypeHostComponent;\n+ }\n+ }\n+ return ElementTypeOtherOrUnknown;\n+}\n+\n+function getChildren(internalInstance: Object): Array<any> {\n+ let children = [];\n+\n+ \/\/ If the parent is a native node without rendered children, but with\n+ \/\/ multiple string children, then the `element` that gets passed in here is\n+ \/\/ a plain value -- a string or number.\n+ if (typeof internalInstance !== 'object') {\n+ \/\/ No children\n+ } else if (\n+ internalInstance._currentElement === null ||\n+ internalInstance._currentElement === false\n+ ) {\n+ \/\/ No children\n+ } else if (internalInstance._renderedComponent) {\n+ const child = internalInstance._renderedComponent;\n+ if (getElementType(child) !== ElementTypeOtherOrUnknown) {\n+ children.push(child);\n+ }\n+ } else if (internalInstance._renderedChildren) {\n+ const renderedChildren = internalInstance._renderedChildren;\n+ for (let name in renderedChildren) {\n+ const child = renderedChildren[name];\n+ if (getElementType(child) !== ElementTypeOtherOrUnknown) {\n+ children.push(child);\n+ }\n+ }\n+ }\n+ \/\/ Note: we skip the case where children are just strings or numbers\n+ \/\/ because the new DevTools skips over host text nodes anyway.\n+ return children;\n+}\n+\n+export function attach(\n+ hook: DevToolsHook,\n+ rendererID: number,\n+ renderer: LegacyRenderer,\n+ global: Object\n+): RendererInterface {\n+ const idToInternalInstanceMap: Map<number, InternalInstance> = new Map();\n+ const internalInstanceToIDMap: WeakMap<\n+ InternalInstance,\n+ number\n+ > = new WeakMap();\n+ const internalInstanceToRootIDMap: WeakMap<\n+ InternalInstance,\n+ number\n+ > = new WeakMap();\n+\n+ let getInternalIDForNative: GetFiberIDForNative = ((null: any): GetFiberIDForNative);\n+ let findNativeNodeForInternalID: (id: number) => ?NativeType;\n+\n+ if (renderer.ComponentTree) {\n+ getInternalIDForNative = (node, findNearestUnfilteredAncestor) => {\n+ const internalInstance = renderer.ComponentTree.getClosestInstanceFromNode(\n+ node\n+ );\n+ return internalInstanceToIDMap.get(internalInstance) || null;\n+ };\n+ findNativeNodeForInternalID = (id: number) => {\n+ const internalInstance = idToInternalInstanceMap.get(id);\n+ return renderer.ComponentTree.getNodeFromInstance(internalInstance);\n+ };\n+ } else if (renderer.Mount.getID && renderer.Mount.getNode) {\n+ getInternalIDForNative = (node, findNearestUnfilteredAncestor) => {\n+ \/\/ Not implemented.\n+ return null;\n+ };\n+ findNativeNodeForInternalID = (id: number) => {\n+ \/\/ Not implemented.\n+ return null;\n+ };\n+ }\n+\n+ function getID(internalInstance: InternalInstance): number {\n+ if (typeof internalInstance !== 'object') {\n+ throw new Error('Invalid internal instance: ' + internalInstance);\n+ }\n+ if (!internalInstanceToIDMap.has(internalInstance)) {\n+ const id = getUID();\n+ internalInstanceToIDMap.set(internalInstance, id);\n+ idToInternalInstanceMap.set(id, internalInstance);\n+ }\n+ return ((internalInstanceToIDMap.get(internalInstance): any): number);\n+ }\n+\n+ function areEqualArrays(a, b) {\n+ if (a.length !== b.length) {\n+ return false;\n+ }\n+ for (let i = 0; i < a.length; i++) {\n+ if (a[i] !== b[i]) {\n+ return false;\n+ }\n+ }\n+ return true;\n+ }\n+\n+ \/\/ This is shared mutable state that lets us keep track of where we are.\n+ let parentIDStack = [];\n+\n+ let oldReconcilerMethods = null;\n+ if (renderer.Reconciler) {\n+ \/\/ React 15\n+ oldReconcilerMethods = decorateMany(renderer.Reconciler, {\n+ mountComponent(fn, args) {\n+ const [internalInstance, , , hostContainerInfo] = args;\n+ if (getElementType(internalInstance) === ElementTypeOtherOrUnknown) {\n+ return fn.apply(this, args);\n+ }\n+\n+ const id = getID(internalInstance);\n+\n+ \/\/ Push the operation.\n+ const parentID =\n+ parentIDStack.length > 0\n+ ? parentIDStack[parentIDStack.length - 1]\n+ : 0;\n+ recordMount(internalInstance, id, parentID);\n+ parentIDStack.push(id);\n+\n+ \/\/ Remember the root.\n+ internalInstanceToRootIDMap.set(\n+ internalInstance,\n+ getID(hostContainerInfo._topLevelWrapper)\n+ );\n+\n+ try {\n+ const result = fn.apply(this, args);\n+ parentIDStack.pop();\n+ return result;\n+ } catch (err) {\n+ parentIDStack = [];\n+ throw err;\n+ } finally {\n+ if (parentIDStack.length === 0) {\n+ const rootID = internalInstanceToRootIDMap.get(internalInstance);\n+ if (rootID === undefined) {\n+ throw new Error('Expected to find root ID.');\n+ }\n+ flushPendingEvents(rootID);\n+ }\n+ }\n+ },\n+ performUpdateIfNecessary(fn, args) {\n+ const [internalInstance] = args;\n+ if (getElementType(internalInstance) === ElementTypeOtherOrUnknown) {\n+ return fn.apply(this, args);\n+ }\n+\n+ const id = getID(internalInstance);\n+ parentIDStack.push(id);\n+\n+ const prevChildren = getChildren(internalInstance);\n+ try {\n+ const result = fn.apply(this, args);\n+\n+ const nextChildren = getChildren(internalInstance);\n+ if (!areEqualArrays(prevChildren, nextChildren)) {\n+ \/\/ Push the operation\n+ recordReorder(internalInstance, id, nextChildren);\n+ }\n+\n+ parentIDStack.pop();\n+ return result;\n+ } catch (err) {\n+ parentIDStack = [];\n+ throw err;\n+ } finally {\n+ if (parentIDStack.length === 0) {\n+ const rootID = internalInstanceToRootIDMap.get(internalInstance);\n+ if (rootID === undefined) {\n+ throw new Error('Expected to find root ID.');\n+ }\n+ flushPendingEvents(rootID);\n+ }\n+ }\n+ },\n+ receiveComponent(fn, args) {\n+ const [internalInstance] = args;\n+ if (getElementType(internalInstance) === ElementTypeOtherOrUnknown) {\n+ return fn.apply(this, args);\n+ }\n+\n+ const id = getID(internalInstance);\n+ parentIDStack.push(id);\n+\n+ const prevChildren = getChildren(internalInstance);\n+ try {\n+ const result = fn.apply(this, args);\n+\n+ const nextChildren = getChildren(internalInstance);\n+ if (!areEqualArrays(prevChildren, nextChildren)) {\n+ \/\/ Push the operation\n+ recordReorder(internalInstance, id, nextChildren);\n+ }\n+\n+ parentIDStack.pop();\n+ return result;\n+ } catch (err) {\n+ parentIDStack = [];\n+ throw err;\n+ } finally {\n+ if (parentIDStack.length === 0) {\n+ const rootID = internalInstanceToRootIDMap.get(internalInstance);\n+ if (rootID === undefined) {\n+ throw new Error('Expected to find root ID.');\n+ }\n+ flushPendingEvents(rootID);\n+ }\n+ }\n+ },\n+ unmountComponent(fn, args) {\n+ const [internalInstance] = args;\n+ if (getElementType(internalInstance) === ElementTypeOtherOrUnknown) {\n+ return fn.apply(this, args);\n+ }\n+\n+ const id = getID(internalInstance);\n+ parentIDStack.push(id);\n+ try {\n+ const result = fn.apply(this, args);\n+ parentIDStack.pop();\n+\n+ \/\/ Push the operation.\n+ recordUnmount(internalInstance, id);\n+\n+ return result;\n+ } catch (err) {\n+ parentIDStack = [];\n+ throw err;\n+ } finally {\n+ if (parentIDStack.length === 0) {\n+ const rootID = internalInstanceToRootIDMap.get(internalInstance);\n+ if (rootID === undefined) {\n+ throw new Error('Expected to find root ID.');\n+ }\n+ flushPendingEvents(rootID);\n+ }\n+ }\n+ },\n+ });\n+ }\n+\n+ function cleanup() {\n+ if (oldReconcilerMethods !== null) {\n+ if (renderer.Component) {\n+ restoreMany(renderer.Component.Mixin, oldReconcilerMethods);\n+ } else {\n+ restoreMany(renderer.Reconciler, oldReconcilerMethods);\n+ }\n+ }\n+ oldReconcilerMethods = null;\n+ }\n+\n+ function recordMount(\n+ internalInstance: InternalInstance,\n+ id: number,\n+ parentID: number\n+ ) {\n+ const isRoot = parentID === 0;\n+\n+ if (__DEBUG__) {\n+ console.log(\n+ '%crecordMount()',\n+ 'color: green; font-weight: bold;',\n+ id,\n+ getData(internalInstance).displayName\n+ );\n+ }\n+\n+ if (isRoot) {\n+ \/\/ TODO Is this right? For all versions?\n+ const hasOwnerMetadata =\n+ internalInstance._currentElement != null &&\n+ internalInstance._currentElement._owner != null;\n+\n+ pushOperation(TREE_OPERATION_ADD);\n+ pushOperation(id);\n+ pushOperation(ElementTypeRoot);\n+ pushOperation(0); \/\/ isProfilingSupported?\n+ pushOperation(hasOwnerMetadata ? 1 : 0);\n+ } else {\n+ const { displayName, key, type } = getData(internalInstance);\n+\n+ const ownerID =\n+ internalInstance._currentElement != null &&\n+ internalInstance._currentElement._owner != null\n+ ? getID(internalInstance._currentElement._owner)\n+ : 0;\n+\n+ let displayNameStringID = getStringID(displayName);\n+ let keyStringID = getStringID(key);\n+ pushOperation(TREE_OPERATION_ADD);\n+ pushOperation(id);\n+ pushOperation(type);\n+ pushOperation(parentID);\n+ pushOperation(ownerID);\n+ pushOperation(displayNameStringID);\n+ pushOperation(keyStringID);\n+ }\n+ }\n+\n+ function recordReorder(\n+ internalInstance: InternalInstance,\n+ id: number,\n+ nextChildren: Array<InternalInstance>\n+ ) {\n+ pushOperation(TREE_OPERATION_REORDER_CHILDREN);\n+ pushOperation(id);\n+ const nextChildIDs = nextChildren.map(getID);\n+ pushOperation(nextChildIDs.length);\n+ for (let i = 0; i < nextChildIDs.length; i++) {\n+ pushOperation(nextChildIDs[i]);\n+ }\n+ }\n+\n+ function recordUnmount(internalInstance: InternalInstance, id: number) {\n+ pendingUnmountedIDs.push(id);\n+ idToInternalInstanceMap.delete(id);\n+ }\n+\n+ function crawlAndRecordInitialMounts(id: number, parentID: number) {\n+ const internalInstance = idToInternalInstanceMap.get(id);\n+\n+ if (__DEBUG__) {\n+ console.group('crawlAndRecordInitialMounts() id:', id);\n+ }\n+\n+ recordMount(internalInstance, id, parentID);\n+ getChildren(internalInstance).forEach(child =>\n+ crawlAndRecordInitialMounts(getID(child), id)\n+ );\n+\n+ if (__DEBUG__) {\n+ console.groupEnd();\n+ }\n+ }\n+\n+ function flushInitialOperations() {\n+ \/\/ Crawl roots though and register any nodes that mounted before we were injected.\n+\n+ const roots =\n+ renderer.Mount._instancesByReactRootID ||\n+ renderer.Mount._instancesByContainerID;\n+\n+ for (let key in roots) {\n+ const internalInstance = roots[key];\n+ const id = getID(internalInstance);\n+ crawlAndRecordInitialMounts(id, 0);\n+ flushPendingEvents(id);\n+ }\n+ }\n+\n+ let pendingOperations: Array<number> = [];\n+ let pendingStringTable: Map<string, number> = new Map();\n+ let pendingUnmountedIDs: Array<number> = [];\n+ let pendingStringTableLength: number = 0;\n+ let pendingUnmountedRootID: number | null = null;\n+\n+ function flushPendingEvents(rootID: number) {\n+ if (\n+ pendingOperations.length === 0 &&\n+ pendingUnmountedIDs.length === 0 &&\n+ pendingUnmountedRootID === null\n+ ) {\n+ return;\n+ }\n+\n+ const numUnmountIDs =\n+ pendingUnmountedIDs.length + (pendingUnmountedRootID === null ? 0 : 1);\n+\n+ const operations = new Uint32Array(\n+ \/\/ Identify which renderer this update is coming from.\n+ 2 + \/\/ [rendererID, rootFiberID]\n+ \/\/ How big is the string table?\n+ 1 + \/\/ [stringTableLength]\n+ \/\/ Then goes the actual string table.\n+ pendingStringTableLength +\n+ \/\/ All unmounts are batched in a single message.\n+ \/\/ [TREE_OPERATION_REMOVE, removedIDLength, ...ids]\n+ (numUnmountIDs > 0 ? 2 + numUnmountIDs : 0) +\n+ \/\/ Mount operations\n+ pendingOperations.length\n+ );\n+\n+ \/\/ Identify which renderer this update is coming from.\n+ \/\/ This enables roots to be mapped to renderers,\n+ \/\/ Which in turn enables fiber properations, states, and hooks to be inspected.\n+ let i = 0;\n+ operations[i++] = rendererID;\n+ operations[i++] = rootID;\n+\n+ \/\/ Now fill in the string table.\n+ \/\/ [stringTableLength, str1Length, ...str1, str2Length, ...str2, ...]\n+ operations[i++] = pendingStringTableLength;\n+ pendingStringTable.forEach((value, key) => {\n+ operations[i++] = key.length;\n+ operations.set(utfEncodeString(key), i);\n+ i += key.length;\n+ });\n+\n+ if (numUnmountIDs > 0) {\n+ \/\/ All unmounts except roots are batched in a single message.\n+ operations[i++] = TREE_OPERATION_REMOVE;\n+ \/\/ The first number is how many unmounted IDs we're gonna send.\n+ operations[i++] = numUnmountIDs;\n+ \/\/ Fill in the unmounts\n+ for (let j = 0; j < pendingUnmountedIDs.length; j++) {\n+ operations[i++] = pendingUnmountedIDs[j];\n+ }\n+ \/\/ The root ID should always be unmounted last.\n+ if (pendingUnmountedRootID !== null) {\n+ operations[i] = pendingUnmountedRootID;\n+ i++;\n+ }\n+ }\n+\n+ \/\/ Fill in the rest of the operations.\n+ operations.set(pendingOperations, i);\n+ i += pendingOperations.length;\n+\n+ if (__DEBUG__) {\n+ printOperationsArray(operations);\n+ }\n+\n+ \/\/ If we've already connected to the frontend, just pass the operations through.\n+ hook.emit('operations', operations);\n+\n+ pendingOperations.length = 0;\n+ pendingUnmountedIDs = [];\n+ pendingUnmountedRootID = null;\n+ pendingStringTable.clear();\n+ pendingStringTableLength = 0;\n+ }\n+\n+ function pushOperation(op: number): void {\n+ if (__DEV__) {\n+ if (!Number.isInteger(op)) {\n+ console.error(\n+ 'pushOperation() was called but the value is not an integer.',\n+ op\n+ );\n+ }\n+ }\n+ pendingOperations.push(op);\n+ }\n+\n+ function getStringID(str: string | null): number {\n+ if (str === null) {\n+ return 0;\n+ }\n+ const existingID = pendingStringTable.get(str);\n+ if (existingID !== undefined) {\n+ return existingID;\n+ }\n+ const stringID = pendingStringTable.size + 1;\n+ pendingStringTable.set(str, stringID);\n+ \/\/ The string table total length needs to account\n+ \/\/ both for the string length, and for the array item\n+ \/\/ that contains the length itself. Hence + 1.\n+ pendingStringTableLength += str.length + 1;\n+ return stringID;\n+ }\n+\n+ function inspectElement(id: number): InspectedElement | null {\n+ let result = inspectElementRaw(id);\n+ if (result === null) {\n+ return null;\n+ }\n+ \/\/ TODO Review sanitization approach for the below inspectable values.\n+ result.context = cleanForBridge(result.context);\n+ result.props = cleanForBridge(result.props);\n+ result.state = cleanForBridge(result.state);\n+ return result;\n+ }\n+\n+ function inspectElementRaw(id: number): InspectedElement | null {\n+ const internalInstance = idToInternalInstanceMap.get(id);\n+ const data = getData(internalInstance);\n+\n+ let context = null;\n+ let owners = null;\n+ let props = null;\n+ let state = null;\n+ let source = null;\n+\n+ if (internalInstance != null) {\n+ const element = internalInstance._currentElement;\n+ if (element !== null) {\n+ props = element.props;\n+ source = element._source != null ? element._source : null;\n+\n+ let owner = element._owner;\n+ if (owner) {\n+ owners = [];\n+ while (owner != null) {\n+ const ownerData = getData(owner);\n+ owners.push({\n+ displayName: ownerData.displayName || 'Unknown',\n+ id: getID(owner),\n+ type: ownerData.type,\n+ });\n+ owner = owner.owner;\n+ }\n+ }\n+ }\n+ context = internalInstance.context || null;\n+ state = internalInstance.state || null;\n+ }\n+\n+ return {\n+ id,\n+\n+ \/\/ Hooks did not exist in legacy versions\n+ canEditHooks: false,\n+\n+ \/\/ Does the current renderer support editable function props?\n+ canEditFunctionProps: true,\n+\n+ \/\/ Suspense did not exist in legacy versions\n+ canToggleSuspense: false,\n+\n+ \/\/ Can view component source location.\n+ canViewSource:\n+ data.type === ElementTypeClass || data.type === ElementTypeFunction,\n+\n+ displayName: data.displayName,\n+\n+ type: data.type,\n+\n+ \/\/ New events system did not exist in legacy versions\n+ events: null,\n+\n+ \/\/ Inspectable properties.\n+ context,\n+ hooks: null,\n+ props,\n+ state,\n+\n+ \/\/ List of owners\n+ owners,\n+\n+ \/\/ Location of component in source coude.\n+ source,\n+ };\n+ }\n+\n+ function logElementToConsole(id: number): void {\n+ const result = inspectElementRaw(id);\n+ if (result === null) {\n+ console.warn(`Could not find element with id \"${id}\"`);\n+ return;\n+ }\n+\n+ const supportsGroup = typeof console.groupCollapsed === 'function';\n+ if (supportsGroup) {\n+ console.groupCollapsed(\n+ `[Click to expand] %c<${result.displayName || 'Component'} \/>`,\n+ \/\/ --dom-tag-name-color is the CSS variable Chrome styles HTML elements with in the console.\n+ 'color: var(--dom-tag-name-color); font-weight: normal;'\n+ );\n+ }\n+ if (result.props !== null) {\n+ console.log('Props:', result.props);\n+ }\n+ if (result.state !== null) {\n+ console.log('State:', result.state);\n+ }\n+ if (result.context !== null) {\n+ console.log('State:', result.context);\n+ }\n+ const nativeNode = findNativeNodeForInternalID(id);\n+ if (nativeNode !== null) {\n+ console.log('Node:', nativeNode);\n+ }\n+ if (window.chrome || \/firefox\/i.test(navigator.userAgent)) {\n+ console.log(\n+ 'Right-click any value to save it as a global variable for further inspection.'\n+ );\n+ }\n+ if (supportsGroup) {\n+ console.groupEnd();\n+ }\n+ }\n+\n+ function prepareViewElementSource(id: number): void {\n+ const internalInstance = idToInternalInstanceMap.get(id);\n+ if (internalInstance == null) {\n+ console.warn(`Could not find instance with id \"${id}\"`);\n+ return;\n+ }\n+\n+ const element = internalInstance._currentElement;\n+ if (element == null) {\n+ console.warn(`Could not find element with id \"${id}\"`);\n+ return;\n+ }\n+\n+ global.$type = element.type;\n+ }\n+\n+ function selectElement(id: number): void {\n+ const internalInstance = idToInternalInstanceMap.get(id);\n+ if (internalInstance == null) {\n+ console.warn(`Could not find instance with id \"${id}\"`);\n+ return;\n+ }\n+\n+ switch (getElementType(internalInstance)) {\n+ case ElementTypeClass:\n+ case ElementTypeFunction:\n+ const element = internalInstance._currentElement;\n+ if (element == null) {\n+ console.warn(`Could not find element with id \"${id}\"`);\n+ return;\n+ }\n+\n+ global.$r = {\n+ props: element.props,\n+ type: element.type,\n+ };\n+ break;\n+ default:\n+ break;\n+ }\n+ }\n+\n+ function setInProps(id: number, path: Array<string | number>, value: any) {\n+ const internalInstance = idToInternalInstanceMap.get(id);\n+ if (internalInstance != null) {\n+ const element = internalInstance._currentElement;\n+ internalInstance._currentElement = {\n+ ...element,\n+ props: copyWithSet(element.props, path, value),\n+ };\n+ forceUpdate(internalInstance._instance);\n+ }\n+ }\n+\n+ function setInState(id: number, path: Array<string | number>, value: any) {\n+ const internalInstance = idToInternalInstanceMap.get(id);\n+ if (internalInstance != null) {\n+ setIn(internalInstance.state, path, value);\n+ internalInstance.forceUpdate();\n+ }\n+ }\n+\n+ function setInContext(id: number, path: Array<string | number>, value: any) {\n+ const internalInstance = idToInternalInstanceMap.get(id);\n+ if (internalInstance != null) {\n+ setIn(internalInstance.context, path, value);\n+ forceUpdate(internalInstance);\n+ }\n+ }\n+\n+ function setIn(obj: Object, path: Array<string | number>, value: any) {\n+ const last = path.pop();\n+ const parent = path.reduce(\n+ \/\/ $FlowFixMe\n+ (reduced, attr) => (reduced ? reduced[attr] : null),\n+ obj\n+ );\n+ if (parent) {\n+ \/\/ $FlowFixMe\n+ parent[last] = value;\n+ }\n+ }\n+\n+ \/\/ v16+ only features\n+ const getProfilingData = () => {\n+ throw new Error('getProfilingData not supported by this renderer');\n+ };\n+ const handleCommitFiberRoot = () => {\n+ throw new Error('handleCommitFiberRoot not supported by this renderer');\n+ };\n+ const handleCommitFiberUnmount = () => {\n+ throw new Error('handleCommitFiberUnmount not supported by this renderer');\n+ };\n+ const overrideSuspense = () => {\n+ throw new Error('overrideSuspense not supported by this renderer');\n+ };\n+ const setInHook = () => {\n+ throw new Error('setInHook not supported by this renderer');\n+ };\n+ const startProfiling = () => {\n+ throw new Error('startProfiling not supported by this renderer');\n+ };\n+ const stopProfiling = () => {\n+ throw new Error('stopProfiling not supported by this renderer');\n+ };\n+\n+ function getBestMatchForTrackedPath(): PathMatch | null {\n+ \/\/ Not implemented.\n+ return null;\n+ }\n+\n+ function getPathForElement(id: number): Array<PathFrame> | null {\n+ \/\/ Not implemented.\n+ return null;\n+ }\n+\n+ function updateComponentFilters(componentFilters: Array<ComponentFilter>) {\n+ \/\/ Not implemented.\n+ }\n+\n+ function setTrackedPath(path: Array<PathFrame> | null) {\n+ \/\/ Not implemented.\n+ }\n+\n+ function getOwnersList(id: number): Array<Owner> | null {\n+ \/\/ Not implemented.\n+ return null;\n+ }\n+\n+ return {\n+ cleanup,\n+ flushInitialOperations,\n+ getBestMatchForTrackedPath,\n+ getFiberIDForNative: getInternalIDForNative,\n+ findNativeNodesForFiberID: (id: number) => {\n+ const nativeNode = findNativeNodeForInternalID(id);\n+ return nativeNode == null ? null : [nativeNode];\n+ },\n+ getOwnersList,\n+ getPathForElement,\n+ getProfilingData,\n+ handleCommitFiberRoot,\n+ handleCommitFiberUnmount,\n+ inspectElement,\n+ logElementToConsole,\n+ overrideSuspense,\n+ prepareViewElementSource,\n+ renderer,\n+ selectElement,\n+ setInContext,\n+ setInHook,\n+ setInProps,\n+ setInState,\n+ setTrackedPath,\n+ startProfiling,\n+ stopProfiling,\n+ updateComponentFilters,\n+ };\n+}\ndiff --git a\/src\/backend\/legacy\/utils.js b\/src\/backend\/legacy\/utils.js\nnew file mode 100644\nindex 0000000000..9fbe307935\n--- \/dev\/null\n+++ b\/src\/backend\/legacy\/utils.js\n@@ -0,0 +1,39 @@\n+\/\/ @flow\n+\n+import type { InternalInstance } from '.\/renderer';\n+\n+export function decorate(object: Object, attr: string, fn: Function): Function {\n+ const old = object[attr];\n+ object[attr] = function(instance: InternalInstance) {\n+ return fn.call(this, old, arguments);\n+ };\n+ return old;\n+}\n+\n+export function decorateMany(\n+ source: Object,\n+ fns: { [attr: string]: Function }\n+): Object {\n+ const olds = {};\n+ for (const name in fns) {\n+ olds[name] = decorate(source, name, fns[name]);\n+ }\n+ return olds;\n+}\n+\n+export function restoreMany(source: Object, olds: Object): void {\n+ for (let name in olds) {\n+ source[name] = olds[name];\n+ }\n+}\n+\n+export function forceUpdate(instance: InternalInstance): void {\n+ if (typeof instance.forceUpdate === 'function') {\n+ instance.forceUpdate();\n+ } else if (\n+ instance.updater != null &&\n+ typeof instance.updater.enqueueForceUpdate === 'function'\n+ ) {\n+ instance.updater.enqueueForceUpdate(this, () => {}, 'forceUpdate');\n+ }\n+}\ndiff --git a\/src\/backend\/types.js b\/src\/backend\/types.js\nindex d2fd74139e..af2cdd2923 100644\n--- a\/src\/backend\/types.js\n+++ b\/src\/backend\/types.js\n@@ -79,11 +79,17 @@ export type FiberData = {|\n type: ElementType,\n |};\n \n-export type NativeType = {};\n+export type NativeType = Object;\n export type RendererID = number;\n \n type Dispatcher = any;\n \n+export type GetFiberIDForNative = (\n+ component: NativeType,\n+ findNearestUnfilteredAncestor?: boolean\n+) => number | null;\n+export type FindNativeNodesForFiberID = (id: number) => ?Array<NativeType>;\n+\n export type ReactRenderer = {\n findFiberByHostInstance: (hostInstance: NativeType) => ?Fiber,\n version: string,\n@@ -208,13 +214,10 @@ export type InspectedElement = {|\n \n export type RendererInterface = {\n cleanup: () => void,\n- findNativeNodesForFiberID: (id: number) => ?Array<NativeType>,\n+ findNativeNodesForFiberID: FindNativeNodesForFiberID,\n flushInitialOperations: () => void,\n getBestMatchForTrackedPath: () => PathMatch | null,\n- getFiberIDForNative: (\n- component: NativeType,\n- findNearestUnfilteredAncestor?: boolean\n- ) => number | null,\n+ getFiberIDForNative: GetFiberIDForNative,\n getProfilingData(): ProfilingDataBackend,\n getOwnersList: (id: number) => Array<Owner> | null,\n getPathForElement: (id: number) => Array<PathFrame> | null,\ndiff --git a\/src\/utils.js b\/src\/utils.js\nindex 7c7a711f0b..85d8556cb7 100644\n--- a\/src\/utils.js\n+++ b\/src\/utils.js\n@@ -1,6 +1,13 @@\n \/\/ @flow\n \n import LRU from 'lru-cache';\n+import {\n+ TREE_OPERATION_ADD,\n+ TREE_OPERATION_REMOVE,\n+ TREE_OPERATION_REORDER_CHILDREN,\n+ TREE_OPERATION_UPDATE_TREE_BASE_DURATION,\n+} from '.\/constants';\n+import { ElementTypeRoot } from 'src\/types';\n import { LOCAL_STORAGE_FILTER_PREFERENCES_KEY } from '.\/constants';\n import { ComponentFilterElementType, ElementTypeHostComponent } from '.\/types';\n import {\n@@ -71,6 +78,99 @@ function toCodePoint(string: string) {\n return string.codePointAt(0);\n }\n \n+export function printOperationsArray(operations: Uint32Array) {\n+ \/\/ The first two values are always rendererID and rootID\n+ const rendererID = operations[0];\n+ const rootID = operations[1];\n+\n+ const logs = [`opertions for renderer:${rendererID} and root:${rootID}`];\n+\n+ let i = 2;\n+\n+ \/\/ Reassemble the string table.\n+ const stringTable = [\n+ null, \/\/ ID = 0 corresponds to the null string.\n+ ];\n+ const stringTableSize = operations[i++];\n+ const stringTableEnd = i + stringTableSize;\n+ while (i < stringTableEnd) {\n+ const nextLength = operations[i++];\n+ const nextString = utfDecodeString(\n+ (operations.slice(i, i + nextLength): any)\n+ );\n+ stringTable.push(nextString);\n+ i += nextLength;\n+ }\n+\n+ while (i < operations.length) {\n+ const operation = operations[i];\n+\n+ switch (operation) {\n+ case TREE_OPERATION_ADD: {\n+ const id = ((operations[i + 1]: any): number);\n+ const type = ((operations[i + 2]: any): ElementType);\n+\n+ i += 3;\n+\n+ if (type === ElementTypeRoot) {\n+ logs.push(`Add new root node ${id}`);\n+\n+ i++; \/\/ supportsProfiling\n+ i++; \/\/ hasOwnerMetadata\n+ } else {\n+ const parentID = ((operations[i]: any): number);\n+ i++;\n+\n+ i++; \/\/ ownerID\n+\n+ const displayNameStringID = operations[i];\n+ const displayName = stringTable[displayNameStringID];\n+ i++;\n+\n+ i++; \/\/ key\n+\n+ logs.push(\n+ `Add node ${id} (${displayName || 'null'}) as child of ${parentID}`\n+ );\n+ }\n+ break;\n+ }\n+ case TREE_OPERATION_REMOVE: {\n+ const removeLength = ((operations[i + 1]: any): number);\n+ i += 2;\n+\n+ for (let removeIndex = 0; removeIndex < removeLength; removeIndex++) {\n+ const id = ((operations[i]: any): number);\n+ i += 1;\n+\n+ logs.push(`Remove node ${id}`);\n+ }\n+ break;\n+ }\n+ case TREE_OPERATION_REORDER_CHILDREN: {\n+ const id = ((operations[i + 1]: any): number);\n+ const numChildren = ((operations[i + 2]: any): number);\n+ i += 3;\n+ const children = operations.slice(i, i + numChildren);\n+ i += numChildren;\n+\n+ logs.push(`Re-order node ${id} children ${children.join(',')}`);\n+ break;\n+ }\n+ case TREE_OPERATION_UPDATE_TREE_BASE_DURATION:\n+ \/\/ Base duration updates are only sent while profiling is in progress.\n+ \/\/ We can ignore them at this point.\n+ \/\/ The profiler UI uses them lazily in order to generate the tree.\n+ i += 3;\n+ break;\n+ default:\n+ throw Error(`Unsupported Bridge operation ${operation}`);\n+ }\n+ }\n+\n+ console.log(logs.join('\\n '));\n+}\n+\n export function getDefaultComponentFilters(): Array<ComponentFilter> {\n return [\n {\ndiff --git a\/yarn.lock b\/yarn.lock\nindex 0f838a637f..8b7b830466 100644\n--- a\/yarn.lock\n+++ b\/yarn.lock\n@@ -3646,6 +3646,15 @@ create-hmac@^1.1.0, create-hmac@^1.1.2, create-hmac@^1.1.4:\n safe-buffer \"^5.0.1\"\n sha.js \"^2.4.8\"\n \n+create-react-class@^15.6.0:\n+ version \"15.6.3\"\n+ resolved \"https:\/\/registry.yarnpkg.com\/create-react-class\/-\/create-react-class-15.6.3.tgz#2d73237fb3f970ae6ebe011a9e66f46dbca80036\"\n+ integrity sha512-M+\/3Q6E6DLO6Yx3OwrWjwHBnvfXXYA7W+dFjt\/ZDBemHO1DDZhsalX\/NUtnTYclN6GfnBDRh4qRHjcDHmlJBJg==\n+ dependencies:\n+ fbjs \"^0.8.9\"\n+ loose-envify \"^1.3.1\"\n+ object-assign \"^4.1.1\"\n+\n cross-env@^5.2.0:\n version \"5.2.0\"\n resolved \"https:\/\/registry.yarnpkg.com\/cross-env\/-\/cross-env-5.2.0.tgz#6ecd4c015d5773e614039ee529076669b9d126f2\"\n@@ -5243,6 +5252,19 @@ fbjs@0.5.1:\n ua-parser-js \"^0.7.9\"\n whatwg-fetch \"^0.9.0\"\n \n+fbjs@^0.8.9:\n+ version \"0.8.17\"\n+ resolved \"https:\/\/registry.yarnpkg.com\/fbjs\/-\/fbjs-0.8.17.tgz#c4d598ead6949112653d6588b01a5cdcd9f90fdd\"\n+ integrity sha1-xNWY6taUkRJlPWWIsBpc3Nn5D90=\n+ dependencies:\n+ core-js \"^1.0.0\"\n+ isomorphic-fetch \"^2.1.1\"\n+ loose-envify \"^1.0.0\"\n+ object-assign \"^4.1.0\"\n+ promise \"^7.1.1\"\n+ setimmediate \"^1.0.5\"\n+ ua-parser-js \"^0.7.18\"\n+\n fd-slicer@~1.1.0:\n version \"1.1.0\"\n resolved \"https:\/\/registry.yarnpkg.com\/fd-slicer\/-\/fd-slicer-1.1.0.tgz#25c7c89cb1f9077f8891bbe61d8f390eae256f1e\"\n@@ -6162,6 +6184,17 @@ http-errors@1.6.3, http-errors@~1.6.2, http-errors@~1.6.3:\n setprototypeof \"1.1.0\"\n statuses \">= 1.4.0 < 2\"\n \n+http-errors@~1.7.2:\n+ version \"1.7.2\"\n+ resolved \"https:\/\/registry.yarnpkg.com\/http-errors\/-\/http-errors-1.7.2.tgz#4f5029cf13239f31036e5b2e55292bcfbcc85c8f\"\n+ integrity sha512-uUQBt3H\/cSIVfch6i1EuPNy\/YsRSOUBXTVfZ+yR7Zjez3qjBz6i9+i4zjNaoqcoFVI4lQJ5plg63TvGfRSDCRg==\n+ dependencies:\n+ depd \"~1.1.2\"\n+ inherits \"2.0.3\"\n+ setprototypeof \"1.1.1\"\n+ statuses \">= 1.5.0 < 2\"\n+ toidentifier \"1.0.0\"\n+\n http-parser-js@>=0.4.0:\n version \"0.5.0\"\n resolved \"https:\/\/registry.yarnpkg.com\/http-parser-js\/-\/http-parser-js-0.5.0.tgz#d65edbede84349d0dc30320815a15d39cc3cbbd8\"\n@@ -6751,7 +6784,7 @@ is-retry-allowed@^1.0.0:\n resolved \"https:\/\/registry.yarnpkg.com\/is-retry-allowed\/-\/is-retry-allowed-1.1.0.tgz#11a060568b67339444033d0125a61a20d564fb34\"\n integrity sha1-EaBgVotnM5REAz0BJaYaINVk+zQ=\n \n-is-stream@^1.0.0, is-stream@^1.1.0:\n+is-stream@^1.0.0, is-stream@^1.0.1, is-stream@^1.1.0:\n version \"1.1.0\"\n resolved \"https:\/\/registry.yarnpkg.com\/is-stream\/-\/is-stream-1.1.0.tgz#12d4a3dd4e68e0b79ceb8dbc84173ae80d91ca44\"\n integrity sha1-EtSj3U5o4Lec6428hBc66A2RykQ=\n@@ -6826,6 +6859,14 @@ isobject@^3.0.0, isobject@^3.0.1:\n resolved \"https:\/\/registry.yarnpkg.com\/isobject\/-\/isobject-3.0.1.tgz#4e431e92b11a9731636aa1f9c8d1ccbcfdab78df\"\n integrity sha1-TkMekrEalzFjaqH5yNHMvP2reN8=\n \n+isomorphic-fetch@^2.1.1:\n+ version \"2.2.1\"\n+ resolved \"https:\/\/registry.yarnpkg.com\/isomorphic-fetch\/-\/isomorphic-fetch-2.2.1.tgz#611ae1acf14f5e81f729507472819fe9733558a9\"\n+ integrity sha1-YRrhrPFPXoH3KVB0coGf6XM1WKk=\n+ dependencies:\n+ node-fetch \"^1.0.1\"\n+ whatwg-fetch \">=0.10.0\"\n+\n isstream@~0.1.2:\n version \"0.1.2\"\n resolved \"https:\/\/registry.yarnpkg.com\/isstream\/-\/isstream-0.1.2.tgz#47e63f7af55afa6f92e1500e690eb8b8529c099a\"\n@@ -7989,7 +8030,7 @@ loglevel@^1.6.1:\n resolved \"https:\/\/registry.yarnpkg.com\/loglevel\/-\/loglevel-1.6.1.tgz#e0fc95133b6ef276cdc8887cdaf24aa6f156f8fa\"\n integrity sha1-4PyVEztu8nbNyIh82vJKpvFW+Po=\n \n-loose-envify@^1.0.0, loose-envify@^1.1.0, loose-envify@^1.4.0:\n+loose-envify@^1.0.0, loose-envify@^1.1.0, loose-envify@^1.3.1, loose-envify@^1.4.0:\n version \"1.4.0\"\n resolved \"https:\/\/registry.yarnpkg.com\/loose-envify\/-\/loose-envify-1.4.0.tgz#71ee51fa7be4caec1a63839f7e682d8132d30caf\"\n integrity sha512-lyuxPGr\/Wfhrlem2CL\/UcnUc1zcqKAImBDzukY7Y5F\/yQiNdko6+fRLevlw1HgMySw7f611UIY408EtxRSoK3Q==\n@@ -8262,6 +8303,11 @@ mime@1.4.1:\n resolved \"https:\/\/registry.yarnpkg.com\/mime\/-\/mime-1.4.1.tgz#121f9ebc49e3766f311a76e1fa1c8003c4b03aa6\"\n integrity sha512-KI1+qOZu5DcW6wayYHSzR\/tXKCDC5Om4s1z2QJjDULzLcmf3DvzS7oluY4HCTrc+9FiKmWUgeNLg7W3uIQvxtQ==\n \n+mime@1.6.0:\n+ version \"1.6.0\"\n+ resolved \"https:\/\/registry.yarnpkg.com\/mime\/-\/mime-1.6.0.tgz#32cd9e5c64553bd58d19a568af452acff04981b1\"\n+ integrity sha512-x0Vn8spI+wuJ1O6S7gnbaQg8Pxh4NNHb7KSINmEWKiPE4RKOplvijn+NkmYmmRgP68mc70j2EbeTFRsrswaQeg==\n+\n mime@^2.3.1:\n version \"2.4.2\"\n resolved \"https:\/\/registry.yarnpkg.com\/mime\/-\/mime-2.4.2.tgz#ce5229a5e99ffc313abac806b482c10e7ba6ac78\"\n@@ -8395,7 +8441,7 @@ ms@2.0.0:\n resolved \"https:\/\/registry.yarnpkg.com\/ms\/-\/ms-2.0.0.tgz#5608aeadfc00be6c2901df5f9861788de0d597c8\"\n integrity sha1-VgiurfwAvmwpAd9fmGF4jeDVl8g=\n \n-ms@^2.1.1:\n+ms@2.1.1, ms@^2.1.1:\n version \"2.1.1\"\n resolved \"https:\/\/registry.yarnpkg.com\/ms\/-\/ms-2.1.1.tgz#30a5864eb3ebb0a66f2ebe6d727af06a09d86e0a\"\n integrity sha512-tgp+dl5cGk28utYktBsrFqA7HKgrhgPsg6Z\/EfhWI4gl1Hwq8B\/GmY\/0oXZ6nF8hDVesS\/FpnYaD\/kOWhYQvyg==\n@@ -8536,6 +8582,14 @@ nice-try@^1.0.4:\n resolved \"https:\/\/registry.yarnpkg.com\/nice-try\/-\/nice-try-1.0.5.tgz#a3378a7696ce7d223e88fc9b764bd7ef1089e366\"\n integrity sha512-1nh45deeb5olNY7eX82BkPO7SSxR5SSYJiPTrTdFUVYwAl8CKMA5N9PjTYkHiRjisVcxcQ1HXdLhx2qxxJzLNQ==\n \n+node-fetch@^1.0.1:\n+ version \"1.7.3\"\n+ resolved \"https:\/\/registry.yarnpkg.com\/node-fetch\/-\/node-fetch-1.7.3.tgz#980f6f72d85211a5347c6b2bc18c5b84c3eb47ef\"\n+ integrity sha512-NhZ4CsKx7cYm2vSrBAr2PvFOe6sWDf0UYLRqA6svUYg7+\/TSfVAu49jYC4BvQ4Sms9SZgdqGBgroqfDhJdTyKQ==\n+ dependencies:\n+ encoding \"^0.1.11\"\n+ is-stream \"^1.0.1\"\n+\n node-forge@0.7.5:\n version \"0.7.5\"\n resolved \"https:\/\/registry.yarnpkg.com\/node-forge\/-\/node-forge-0.7.5.tgz#6c152c345ce11c52f465c2abd957e8639cd674df\"\n@@ -9155,7 +9209,7 @@ parse5@^3.0.1:\n dependencies:\n \"@types\/node\" \"*\"\n \n-parseurl@~1.3.2:\n+parseurl@~1.3.2, parseurl@~1.3.3:\n version \"1.3.3\"\n resolved \"https:\/\/registry.yarnpkg.com\/parseurl\/-\/parseurl-1.3.3.tgz#9da19e7bee8d12dff0513ed5b76957793bc2e8d4\"\n integrity sha512-CiyeOxFT\/JZyN5m0z9PfXw4SCBJ6Sygz1Dpl0wqjlhDEGGBP1GnsUVEL0p63hoG1fcj3fHynXi9NYO4nWOL+qQ==\n@@ -9517,6 +9571,13 @@ promise@^7.0.3:\n dependencies:\n asap \"~2.0.3\"\n \n+promise@^7.1.1:\n+ version \"7.3.1\"\n+ resolved \"https:\/\/registry.yarnpkg.com\/promise\/-\/promise-7.3.1.tgz#064b72602b18f90f29192b8b1bc418ffd1ebd3bf\"\n+ integrity sha512-nolQXZ\/4L+bP\/UGlkfaIujX9BKxGwmQ9OT4mOt5yvy8iK1h3wqTEJCijzGANTCCl9nWjY41juyAn2K3Q1hLLTg==\n+ dependencies:\n+ asap \"~2.0.3\"\n+\n prompts@^2.0.1:\n version \"2.0.4\"\n resolved \"https:\/\/registry.yarnpkg.com\/prompts\/-\/prompts-2.0.4.tgz#179f9d4db3128b9933aa35f93a800d8fce76a682\"\n@@ -9683,6 +9744,11 @@ range-parser@^1.0.3, range-parser@~1.2.0:\n resolved \"https:\/\/registry.yarnpkg.com\/range-parser\/-\/range-parser-1.2.0.tgz#f49be6b487894ddc40dcc94a322f611092e00d5e\"\n integrity sha1-9JvmtIeJTdxA3MlKMi9hEJLgDV4=\n \n+range-parser@~1.2.1:\n+ version \"1.2.1\"\n+ resolved \"https:\/\/registry.yarnpkg.com\/range-parser\/-\/range-parser-1.2.1.tgz#3cf37023d199e1c24d1a55b84800c2f3e6468031\"\n+ integrity sha512-Hrgsx+orqoygnmhFbKaHE6c296J+HTAQXoxEF6gNupROmmGJRoyzfG3ccAveqCBrwr\/2yxQ5BVd\/GTl5agOwSg==\n+\n raw-body@2.3.3:\n version \"2.3.3\"\n resolved \"https:\/\/registry.yarnpkg.com\/raw-body\/-\/raw-body-2.3.3.tgz#1b324ece6b5706e153855bc1148c65bb7f6ea0c3\"\n@@ -9703,6 +9769,17 @@ rc@^1.0.1, rc@^1.1.6, rc@^1.2.7:\n minimist \"^1.2.0\"\n strip-json-comments \"~2.0.1\"\n \n+\"react-15@npm:react@^15\":\n+ version \"15.6.2\"\n+ resolved \"https:\/\/registry.yarnpkg.com\/react\/-\/react-15.6.2.tgz#dba0434ab439cfe82f108f0f511663908179aa72\"\n+ integrity sha1-26BDSrQ5z+gvEI8PURZjkIF5qnI=\n+ dependencies:\n+ create-react-class \"^15.6.0\"\n+ fbjs \"^0.8.9\"\n+ loose-envify \"^1.1.0\"\n+ object-assign \"^4.1.0\"\n+ prop-types \"^15.5.10\"\n+\n react-color@^2.11.7:\n version \"2.17.0\"\n resolved \"https:\/\/registry.yarnpkg.com\/react-color\/-\/react-color-2.17.0.tgz#e14b8a11f4e89163f65a34c8b43faf93f7f02aaa\"\n@@ -9715,6 +9792,16 @@ react-color@^2.11.7:\n reactcss \"^1.2.0\"\n tinycolor2 \"^1.4.1\"\n \n+\"react-dom-15@npm:react-dom@^15\":\n+ version \"15.6.2\"\n+ resolved \"https:\/\/registry.yarnpkg.com\/react-dom\/-\/react-dom-15.6.2.tgz#41cfadf693b757faf2708443a1d1fd5a02bef730\"\n+ integrity sha1-Qc+t9pO3V\/rycIRDodH9WgK+9zA=\n+ dependencies:\n+ fbjs \"^0.8.9\"\n+ loose-envify \"^1.1.0\"\n+ object-assign \"^4.1.0\"\n+ prop-types \"^15.5.10\"\n+\n react-dom@^0.0.0-50b50c26f:\n version \"0.0.0-50b50c26f\"\n resolved \"https:\/\/registry.yarnpkg.com\/react-dom\/-\/react-dom-0.0.0-50b50c26f.tgz#3cd8da0f2276ed4b7a926e1807d2675b2eb40227\"\n@@ -10497,6 +10584,25 @@ send@0.16.2:\n range-parser \"~1.2.0\"\n statuses \"~1.4.0\"\n \n+send@0.17.1:\n+ version \"0.17.1\"\n+ resolved \"https:\/\/registry.yarnpkg.com\/send\/-\/send-0.17.1.tgz#c1d8b059f7900f7466dd4938bdc44e11ddb376c8\"\n+ integrity sha512-BsVKsiGcQMFwT8UxypobUKyv7irCNRHk1T0G680vk88yf6LBByGcZJOTJCrTP2xVN6yI+XjPJcNuE3V4fT9sAg==\n+ dependencies:\n+ debug \"2.6.9\"\n+ depd \"~1.1.2\"\n+ destroy \"~1.0.4\"\n+ encodeurl \"~1.0.2\"\n+ escape-html \"~1.0.3\"\n+ etag \"~1.8.1\"\n+ fresh \"0.5.2\"\n+ http-errors \"~1.7.2\"\n+ mime \"1.6.0\"\n+ ms \"2.1.1\"\n+ on-finished \"~2.3.0\"\n+ range-parser \"~1.2.1\"\n+ statuses \"~1.5.0\"\n+\n serialize-javascript@^1.4.0:\n version \"1.6.1\"\n resolved \"https:\/\/registry.yarnpkg.com\/serialize-javascript\/-\/serialize-javascript-1.6.1.tgz#4d1f697ec49429a847ca6f442a2a755126c4d879\"\n@@ -10525,6 +10631,16 @@ serve-static@1.13.2:\n parseurl \"~1.3.2\"\n send \"0.16.2\"\n \n+serve-static@^1.14.1:\n+ version \"1.14.1\"\n+ resolved \"https:\/\/registry.yarnpkg.com\/serve-static\/-\/serve-static-1.14.1.tgz#666e636dc4f010f7ef29970a88a674320898b2f9\"\n+ integrity sha512-JMrvUwE54emCYWlTI+hGrGv5I8dEwmco\/00EvkzIIsR7MqrHonbD9pO2MOfFnpFntl7ecpZs+3mW+XbQZu9QCg==\n+ dependencies:\n+ encodeurl \"~1.0.2\"\n+ escape-html \"~1.0.3\"\n+ parseurl \"~1.3.3\"\n+ send \"0.17.1\"\n+\n set-blocking@^2.0.0, set-blocking@~2.0.0:\n version \"2.0.0\"\n resolved \"https:\/\/registry.yarnpkg.com\/set-blocking\/-\/set-blocking-2.0.0.tgz#045f9782d011ae9a6803ddd382b24392b3d890f7\"\n@@ -10550,7 +10666,7 @@ set-value@^2.0.0:\n is-plain-object \"^2.0.3\"\n split-string \"^3.0.1\"\n \n-setimmediate@^1.0.4:\n+setimmediate@^1.0.4, setimmediate@^1.0.5:\n version \"1.0.5\"\n resolved \"https:\/\/registry.yarnpkg.com\/setimmediate\/-\/setimmediate-1.0.5.tgz#290cbb232e306942d7d7ea9b83732ab7856f8285\"\n integrity sha1-KQy7Iy4waULX1+qbg3Mqt4VvgoU=\n@@ -10560,6 +10676,11 @@ setprototypeof@1.1.0:\n resolved \"https:\/\/registry.yarnpkg.com\/setprototypeof\/-\/setprototypeof-1.1.0.tgz#d0bd85536887b6fe7c0d818cb962d9d91c54e656\"\n integrity sha512-BvE\/TwpZX4FXExxOxZyRGQQv651MSwmWKZGqvmPcRIjDqWub67kTKuIMx43cZZrS\/cBBzwBcNDWoFxt2XEFIpQ==\n \n+setprototypeof@1.1.1:\n+ version \"1.1.1\"\n+ resolved \"https:\/\/registry.yarnpkg.com\/setprototypeof\/-\/setprototypeof-1.1.1.tgz#7e95acb24aa92f5885e0abef5ba131330d4ae683\"\n+ integrity sha512-JvdAWfbXeIGaZ9cILp38HntZSFSo3mWg6xGcJJsd+d4aRMOqauag1C63dJfDw7OaMYwEbHMOxEZ1lqVRYP2OAw==\n+\n sha.js@2.2.6:\n version \"2.2.6\"\n resolved \"https:\/\/registry.yarnpkg.com\/sha.js\/-\/sha.js-2.2.6.tgz#17ddeddc5f722fb66501658895461977867315ba\"\n@@ -10962,7 +11083,7 @@ static-extend@^0.1.1:\n define-property \"^0.2.5\"\n object-copy \"^0.1.0\"\n \n-\"statuses@>= 1.4.0 < 2\":\n+\"statuses@>= 1.4.0 < 2\", \"statuses@>= 1.5.0 < 2\", statuses@~1.5.0:\n version \"1.5.0\"\n resolved \"https:\/\/registry.yarnpkg.com\/statuses\/-\/statuses-1.5.0.tgz#161c7dac177659fd9811f43771fa99381478628c\"\n integrity sha1-Fhx9rBd2Wf2YEfQ3cfqZOBR4Yow=\n@@ -11512,6 +11633,11 @@ to-regex@^3.0.1, to-regex@^3.0.2:\n regex-not \"^1.0.2\"\n safe-regex \"^1.1.0\"\n \n+toidentifier@1.0.0:\n+ version \"1.0.0\"\n+ resolved \"https:\/\/registry.yarnpkg.com\/toidentifier\/-\/toidentifier-1.0.0.tgz#7e1be3470f1e77948bc43d94a3c8f4d7752ba553\"\n+ integrity sha512-yaOH\/Pk\/VEhBWWTlhI+qXxDFXlejDGcQipMlyxda9nthulaxLZUNcUqFxokp0vcYnvteJln5FNQDRrxj3YcbVw==\n+\n tosource@1.0.0:\n version \"1.0.0\"\n resolved \"https:\/\/registry.yarnpkg.com\/tosource\/-\/tosource-1.0.0.tgz#42d88dd116618bcf00d6106dd5446f3427902ff1\"\n@@ -11613,7 +11739,7 @@ typedarray@^0.0.6:\n resolved \"https:\/\/registry.yarnpkg.com\/typedarray\/-\/typedarray-0.0.6.tgz#867ac74e3864187b1d3d47d996a78ec5c8830777\"\n integrity sha1-hnrHTjhkGHsdPUfZlqeOxciDB3c=\n \n-ua-parser-js@^0.7.9:\n+ua-parser-js@^0.7.18, ua-parser-js@^0.7.9:\n version \"0.7.19\"\n resolved \"https:\/\/registry.yarnpkg.com\/ua-parser-js\/-\/ua-parser-js-0.7.19.tgz#94151be4c0a7fb1d001af7022fdaca4642659e4b\"\n integrity sha512-T3PVJ6uz8i0HzPxOF9SWzWAlfN\/DavlpQqepn22xgve\/5QecC+XMCAtmUNnY7C9StehaV6exjUCI801lOI7QlQ==\n@@ -12113,6 +12239,11 @@ whatwg-encoding@^1.0.1, whatwg-encoding@^1.0.3:\n dependencies:\n iconv-lite \"0.4.19\"\n \n+whatwg-fetch@>=0.10.0:\n+ version \"3.0.0\"\n+ resolved \"https:\/\/registry.yarnpkg.com\/whatwg-fetch\/-\/whatwg-fetch-3.0.0.tgz#fc804e458cc460009b1a2b966bc8817d2578aefb\"\n+ integrity sha512-9GSJUgz1D4MfyKU7KRqwOjXCXTqWdFNvEr7eUBYchQiVc744mqK\/MzXPNR2WsPkmkOa4ywfg8C2n8h+13Bey1Q==\n+\n whatwg-fetch@^0.9.0:\n version \"0.9.0\"\n resolved \"https:\/\/registry.yarnpkg.com\/whatwg-fetch\/-\/whatwg-fetch-0.9.0.tgz#0e3684c6cb9995b43efc9df03e4c365d95fd9cc0\"\n","commit":{"shortRevision":"37c331533d","revision":"37c331533d9c8b2136d1b5953d80cb0da230769a","authorEmail":"brian.david.vaughn@gmail.com","authoredAt":"2019-06-09T16:24:00-07:00","authorName":"Brian Vaughn","subject":"Merge pull request #173 from bvaughn\/legacy"},"files":[{"status":"M","path":".eslintignore"},{"status":"M","path":".gitignore"},{"status":"A","path":"fixtures\/regression\/14.9.html"},{"status":"A","path":"fixtures\/regression\/15.0.html"},{"status":"A","path":"fixtures\/regression\/15.1.html"},{"status":"A","path":"fixtures\/regression\/15.2.html"},{"status":"A","path":"fixtures\/regression\/15.3.html"},{"status":"A","path":"fixtures\/regression\/15.4.html"},{"status":"A","path":"fixtures\/regression\/15.5.html"},{"status":"A","path":"fixtures\/regression\/15.6.html"},{"status":"A","path":"fixtures\/regression\/16.0.html"},{"status":"A","path":"fixtures\/regression\/16.1.html"},{"status":"A","path":"fixtures\/regression\/16.2.html"},{"status":"A","path":"fixtures\/regression\/16.3.html"},{"status":"A","path":"fixtures\/regression\/16.4.html"},{"status":"A","path":"fixtures\/regression\/16.5.html"},{"status":"A","path":"fixtures\/regression\/16.6.html"},{"status":"A","path":"fixtures\/regression\/16.7.html"},{"status":"A","path":"fixtures\/regression\/canary.html"},{"status":"A","path":"fixtures\/regression\/index.html"},{"status":"A","path":"fixtures\/regression\/next.html"},{"status":"A","path":"fixtures\/regression\/server.js"},{"status":"A","path":"fixtures\/regression\/shared.js"},{"status":"A","path":"fixtures\/regression\/styles.css"},{"status":"M","path":"flow-typed\/jest.js"},{"status":"M","path":"package.json"},{"status":"A","path":"src\/__tests__\/legacy\/__snapshots__\/storeLegacy-v15-test.js.snap"},{"status":"A","path":"src\/__tests__\/legacy\/storeLegacy-v15-test.js"},{"status":"M","path":"src\/__tests__\/utils.js"},{"status":"M","path":"src\/backend\/index.js"},{"status":"A","path":"src\/backend\/legacy\/getData.js"},{"status":"A","path":"src\/backend\/legacy\/renderer.js"},{"status":"A","path":"src\/backend\/legacy\/utils.js"},{"status":"M","path":"src\/backend\/types.js"},{"status":"M","path":"src\/utils.js"},{"status":"M","path":"yarn.lock"}],"parents":["ea03ddd583baad7790f36959fb4abe308e85ac24","e66fcaf17d48adbda479251c86ede7cf1e253fdf"]}</article></body></html>

{"body":"Support legacy React versions","patch":"diff --git a\/.eslintignore b\/.eslintignore\nindex 4b9cfb7dd7..564cfdfb14 100644\n--- a\/.eslintignore\n+++ b\/.eslintignore\n@@ -1,6 +1,5 @@\n node_modules\n \n-flow-typed\n shells\/browser\/chrome\/build\n shells\/browser\/firefox\/build\n shells\/browser\/shared\/build\ndiff --git a\/.gitignore b\/.gitignore\nindex ef86dd7006..e2524be341 100644\n--- a\/.gitignore\n+++ b\/.gitignore\n@@ -12,6 +12,4 @@ yarn-error.log\n yarn-error.log\n .vscode\n .idea\n-.watchmanconfig\n-key.pem\n-\n+.watchmanconfig\n\\ No newline at end of file\ndiff --git a\/fixtures\/regression\/14.9.html b\/fixtures\/regression\/14.9.html\nnew file mode 100644\nindex 0000000000..efa28f49cd\n--- \/dev\/null\n+++ b\/fixtures\/regression\/14.9.html\n@@ -0,0 +1,38 @@\n+\n+\n+ \n+ \n+ React 14.9<\/title>\n+ <link rel=\"stylesheet\" href=\"styles.css\" \/>\n+\n+ <script type=\"text\/javascript\">\n+ \/\/ Enable DevTools to inspect React inside of an <iframe>\n+ \/\/ This must run before React is loaded\n+ __REACT_DEVTOOLS_GLOBAL_HOOK__ = parent.__REACT_DEVTOOLS_GLOBAL_HOOK__;\n+ <\/script>\n+\n+ <script src=\"https:\/\/unpkg.com\/react@0.14.9\/dist\/react.js\"><\/script>\n+ <script src=\"https:\/\/unpkg.com\/react-dom@0.14.9\/dist\/react-dom.js\"><\/script>\n+ \n+ \n+ <script src=\"https:\/\/unpkg.com\/babel-standalone@6\/babel.min.js\"><\/script>\n+ <\/head>\n+ <body>\n+ <div id=\"root\">\n+ If you are seeing this message, you are likely viewing this file using the <code>file<\/code> protocol which does not support cross origin requests.\n+ <br\/><br\/>\n+ Use the <code>server<\/code> script instead:\n+ <br\/><br\/>\n+ <code>node .\/fixtures\/regression\/server.js<\/code><br\/>\n+ <code>open <a href=\"http:\/\/localhost:3000\/fixtures\/regression\/14.9.html\">http:\/\/localhost:3000\/fixtures\/regression\/14.9.html<\/a><\/code>\n+ <\/div>\n+\n+ <script src=\"shared.js\" type=\"text\/babel\"><\/script>\n+\n+ \n+ <\/body>\n+<\/html>\n\\ No newline at end of file\ndiff --git a\/fixtures\/regression\/15.0.html b\/fixtures\/regression\/15.0.html\nnew file mode 100644\nindex 0000000000..464ea1f548\n--- \/dev\/null\n+++ b\/fixtures\/regression\/15.0.html\n@@ -0,0 +1,38 @@\n+<!DOCTYPE html>\n+<html>\n+ <head>\n+ <meta charset=\"UTF-8\" \/>\n+ <title>React 15.0<\/title>\n+ <link rel=\"stylesheet\" href=\"styles.css\" \/>\n+\n+ <script type=\"text\/javascript\">\n+ \/\/ Enable DevTools to inspect React inside of an <iframe>\n+ \/\/ This must run before React is loaded\n+ __REACT_DEVTOOLS_GLOBAL_HOOK__ = parent.__REACT_DEVTOOLS_GLOBAL_HOOK__;\n+ <\/script>\n+\n+ <script src=\"https:\/\/unpkg.com\/react@15.0\/dist\/react.js\"><\/script>\n+ <script src=\"https:\/\/unpkg.com\/react-dom@15.0\/dist\/react-dom.js\"><\/script>\n+ \n+ \n+ <script src=\"https:\/\/unpkg.com\/babel-standalone@6\/babel.min.js\"><\/script>\n+ <\/head>\n+ <body>\n+ <div id=\"root\">\n+ If you are seeing this message, you are likely viewing this file using the <code>file<\/code> protocol which does not support cross origin requests.\n+ <br\/><br\/>\n+ Use the <code>server<\/code> script instead:\n+ <br\/><br\/>\n+ <code>node .\/fixtures\/regression\/server.js<\/code><br\/>\n+ <code>open <a href=\"http:\/\/localhost:3000\/fixtures\/regression\/15.0.html\">http:\/\/localhost:3000\/fixtures\/regression\/15.0.html<\/a><\/code>\n+ <\/div>\n+\n+ <script src=\"shared.js\" type=\"text\/babel\"><\/script>\n+\n+ \n+ <\/body>\n+<\/html>\n\\ No newline at end of file\ndiff --git a\/fixtures\/regression\/15.1.html b\/fixtures\/regression\/15.1.html\nnew file mode 100644\nindex 0000000000..7e02e81bf9\n--- \/dev\/null\n+++ b\/fixtures\/regression\/15.1.html\n@@ -0,0 +1,38 @@\n+<!DOCTYPE html>\n+<html>\n+ <head>\n+ <meta charset=\"UTF-8\" \/>\n+ <title>React 15.1<\/title>\n+ <link rel=\"stylesheet\" href=\"styles.css\" \/>\n+\n+ <script type=\"text\/javascript\">\n+ \/\/ Enable DevTools to inspect React inside of an <iframe>\n+ \/\/ This must run before React is loaded\n+ __REACT_DEVTOOLS_GLOBAL_HOOK__ = parent.__REACT_DEVTOOLS_GLOBAL_HOOK__;\n+ <\/script>\n+\n+ <script src=\"https:\/\/unpkg.com\/react@15.1\/dist\/react.js\"><\/script>\n+ <script src=\"https:\/\/unpkg.com\/react-dom@15.1\/dist\/react-dom.js\"><\/script>\n+ \n+ \n+ <script src=\"https:\/\/unpkg.com\/babel-standalone@6\/babel.min.js\"><\/script>\n+ <\/head>\n+ <body>\n+ <div id=\"root\">\n+ If you are seeing this message, you are likely viewing this file using the <code>file<\/code> protocol which does not support cross origin requests.\n+ <br\/><br\/>\n+ Use the <code>server<\/code> script instead:\n+ <br\/><br\/>\n+ <code>node .\/fixtures\/regression\/server.js<\/code><br\/>\n+ <code>open <a href=\"http:\/\/localhost:3000\/fixtures\/regression\/15.1.html\">http:\/\/localhost:3000\/fixtures\/regression\/15.1.html<\/a><\/code>\n+ <\/div>\n+\n+ <script src=\"shared.js\" type=\"text\/babel\"><\/script>\n+\n+ \n+ <\/body>\n+<\/html>\n\\ No newline at end of file\ndiff --git a\/fixtures\/regression\/15.2.html b\/fixtures\/regression\/15.2.html\nnew file mode 100644\nindex 0000000000..ff1e6b8746\n--- \/dev\/null\n+++ b\/fixtures\/regression\/15.2.html\n@@ -0,0 +1,38 @@\n+<!DOCTYPE html>\n+<html>\n+ <head>\n+ <meta charset=\"UTF-8\" \/>\n+ <title>React 15.2<\/title>\n+ <link rel=\"stylesheet\" href=\"styles.css\" \/>\n+\n+ <script type=\"text\/javascript\">\n+ \/\/ Enable DevTools to inspect React inside of an <iframe>\n+ \/\/ This must run before React is loaded\n+ __REACT_DEVTOOLS_GLOBAL_HOOK__ = parent.__REACT_DEVTOOLS_GLOBAL_HOOK__;\n+ <\/script>\n+\n+ <script src=\"https:\/\/unpkg.com\/react@15.2\/dist\/react.js\"><\/script>\n+ <script src=\"https:\/\/unpkg.com\/react-dom@15.2\/dist\/react-dom.js\"><\/script>\n+ \n+ \n+ <script src=\"https:\/\/unpkg.com\/babel-standalone@6\/babel.min.js\"><\/script>\n+ <\/head>\n+ <body>\n+ <div id=\"root\">\n+ If you are seeing this message, you are likely viewing this file using the <code>file<\/code> protocol which does not support cross origin requests.\n+ <br\/><br\/>\n+ Use the <code>server<\/code> script instead:\n+ <br\/><br\/>\n+ <code>node .\/fixtures\/regression\/server.js<\/code><br\/>\n+ <code>open <a href=\"http:\/\/localhost:3000\/fixtures\/regression\/15.2.html\">http:\/\/localhost:3000\/fixtures\/regression\/15.2.html<\/a><\/code>\n+ <\/div>\n+\n+ <script src=\"shared.js\" type=\"text\/babel\"><\/script>\n+\n+ \n+ <\/body>\n+<\/html>\n\\ No newline at end of file\ndiff --git a\/fixtures\/regression\/15.3.html b\/fixtures\/regression\/15.3.html\nnew file mode 100644\nindex 0000000000..8d1795962e\n--- \/dev\/null\n+++ b\/fixtures\/regression\/15.3.html\n@@ -0,0 +1,38 @@\n+<!DOCTYPE html>\n+<html>\n+ <head>\n+ <meta charset=\"UTF-8\" \/>\n+ <title>React 15.3<\/title>\n+ <link rel=\"stylesheet\" href=\"styles.css\" \/>\n+\n+ <script type=\"text\/javascript\">\n+ \/\/ Enable DevTools to inspect React inside of an <iframe>\n+ \/\/ This must run before React is loaded\n+ __REACT_DEVTOOLS_GLOBAL_HOOK__ = parent.__REACT_DEVTOOLS_GLOBAL_HOOK__;\n+ <\/script>\n+\n+ <script src=\"https:\/\/unpkg.com\/react@15.3\/dist\/react.js\"><\/script>\n+ <script src=\"https:\/\/unpkg.com\/react-dom@15.3\/dist\/react-dom.js\"><\/script>\n+ \n+ \n+ <script src=\"https:\/\/unpkg.com\/babel-standalone@6\/babel.min.js\"><\/script>\n+ <\/head>\n+ <body>\n+ <div id=\"root\">\n+ If you are seeing this message, you are likely viewing this file using the <code>file<\/code> protocol which does not support cross origin requests.\n+ <br\/><br\/>\n+ Use the <code>server<\/code> script instead:\n+ <br\/><br\/>\n+ <code>node .\/fixtures\/regression\/server.js<\/code><br\/>\n+ <code>open <a href=\"http:\/\/localhost:3000\/fixtures\/regression\/15.3.html\">http:\/\/localhost:3000\/fixtures\/regression\/15.3.html<\/a><\/code>\n+ <\/div>\n+\n+ <script src=\"shared.js\" type=\"text\/babel\"><\/script>\n+\n+ \n+ <\/body>\n+<\/html>\n\\ No newline at end of file\ndiff --git a\/fixtures\/regression\/15.4.html b\/fixtures\/regression\/15.4.html\nnew file mode 100644\nindex 0000000000..ee1bfc0723\n--- \/dev\/null\n+++ b\/fixtures\/regression\/15.4.html\n@@ -0,0 +1,38 @@\n+<!DOCTYPE html>\n+<html>\n+ <head>\n+ <meta charset=\"UTF-8\" \/>\n+ <title>React 15.4<\/title>\n+ <link rel=\"stylesheet\" href=\"styles.css\" \/>\n+\n+ <script type=\"text\/javascript\">\n+ \/\/ Enable DevTools to inspect React inside of an <iframe>\n+ \/\/ This must run before React is loaded\n+ __REACT_DEVTOOLS_GLOBAL_HOOK__ = parent.__REACT_DEVTOOLS_GLOBAL_HOOK__;\n+ <\/script>\n+\n+ <script src=\"https:\/\/unpkg.com\/react@15.4\/dist\/react.js\"><\/script>\n+ <script src=\"https:\/\/unpkg.com\/react-dom@15.4\/dist\/react-dom.js\"><\/script>\n+ \n+ \n+ <script src=\"https:\/\/unpkg.com\/babel-standalone@6\/babel.min.js\"><\/script>\n+ <\/head>\n+ <body>\n+ <div id=\"root\">\n+ If you are seeing this message, you are likely viewing this file using the <code>file<\/code> protocol which does not support cross origin requests.\n+ <br\/><br\/>\n+ Use the <code>server<\/code> script instead:\n+ <br\/><br\/>\n+ <code>node .\/fixtures\/regression\/server.js<\/code><br\/>\n+ <code>open <a href=\"http:\/\/localhost:3000\/fixtures\/regression\/15.4.html\">http:\/\/localhost:3000\/fixtures\/regression\/15.4.html<\/a><\/code>\n+ <\/div>\n+\n+ <script src=\"shared.js\" type=\"text\/babel\"><\/script>\n+\n+ \n+ <\/body>\n+<\/html>\n\\ No newline at end of file\ndiff --git a\/fixtures\/regression\/15.5.html b\/fixtures\/regression\/15.5.html\nnew file mode 100644\nindex 0000000000..4097bdf708\n--- \/dev\/null\n+++ b\/fixtures\/regression\/15.5.html\n@@ -0,0 +1,38 @@\n+<!DOCTYPE html>\n+<html>\n+ <head>\n+ <meta charset=\"UTF-8\" \/>\n+ <title>React 15.5<\/title>\n+ <link rel=\"stylesheet\" href=\"styles.css\" \/>\n+\n+ <script type=\"text\/javascript\">\n+ \/\/ Enable DevTools to inspect React inside of an <iframe>\n+ \/\/ This must run before React is loaded\n+ __REACT_DEVTOOLS_GLOBAL_HOOK__ = parent.__REACT_DEVTOOLS_GLOBAL_HOOK__;\n+ <\/script>\n+\n+ <script src=\"https:\/\/unpkg.com\/react@15.5\/dist\/react.js\"><\/script>\n+ <script src=\"https:\/\/unpkg.com\/react-dom@15.5\/dist\/react-dom.js\"><\/script>\n+ \n+ \n+ <script src=\"https:\/\/unpkg.com\/babel-standalone@6\/babel.min.js\"><\/script>\n+ <\/head>\n+ <body>\n+ <div id=\"root\">\n+ If you are seeing this message, you are likely viewing this file using the <code>file<\/code> protocol which does not support cross origin requests.\n+ <br\/><br\/>\n+ Use the <code>server<\/code> script instead:\n+ <br\/><br\/>\n+ <code>node .\/fixtures\/regression\/server.js<\/code><br\/>\n+ <code>open <a href=\"http:\/\/localhost:3000\/fixtures\/regression\/15.5.html\">http:\/\/localhost:3000\/fixtures\/regression\/15.5.html<\/a><\/code>\n+ <\/div>\n+\n+ <script src=\"shared.js\" type=\"text\/babel\"><\/script>\n+\n+ \n+ <\/body>\n+<\/html>\n\\ No newline at end of file\ndiff --git a\/fixtures\/regression\/15.6.html b\/fixtures\/regression\/15.6.html\nnew file mode 100644\nindex 0000000000..ab10ba8716\n--- \/dev\/null\n+++ b\/fixtures\/regression\/15.6.html\n@@ -0,0 +1,38 @@\n+<!DOCTYPE html>\n+<html>\n+ <head>\n+ <meta charset=\"UTF-8\" \/>\n+ <title>React 15.6<\/title>\n+ <link rel=\"stylesheet\" href=\"styles.css\" \/>\n+\n+ <script type=\"text\/javascript\">\n+ \/\/ Enable DevTools to inspect React inside of an <iframe>\n+ \/\/ This must run before React is loaded\n+ __REACT_DEVTOOLS_GLOBAL_HOOK__ = parent.__REACT_DEVTOOLS_GLOBAL_HOOK__;\n+ <\/script>\n+\n+ <script src=\"https:\/\/unpkg.com\/react@15.6\/dist\/react.js\"><\/script>\n+ <script src=\"https:\/\/unpkg.com\/react-dom@15.6\/dist\/react-dom.js\"><\/script>\n+ \n+ \n+ <script src=\"https:\/\/unpkg.com\/babel-standalone@6\/babel.min.js\"><\/script>\n+ <\/head>\n+ <body>\n+ <div id=\"root\">\n+ If you are seeing this message, you are likely viewing this file using the <code>file<\/code> protocol which does not support cross origin requests.\n+ <br\/><br\/>\n+ Use the <code>server<\/code> script instead:\n+ <br\/><br\/>\n+ <code>node .\/fixtures\/regression\/server.js<\/code><br\/>\n+ <code>open <a href=\"http:\/\/localhost:3000\/fixtures\/regression\/15.6.html\">http:\/\/localhost:3000\/fixtures\/regression\/15.6.html<\/a><\/code>\n+ <\/div>\n+\n+ <script src=\"shared.js\" type=\"text\/babel\"><\/script>\n+\n+ \n+ <\/body>\n+<\/html>\n\\ No newline at end of file\ndiff --git a\/fixtures\/regression\/16.0.html b\/fixtures\/regression\/16.0.html\nnew file mode 100644\nindex 0000000000..7c55d75114\n--- \/dev\/null\n+++ b\/fixtures\/regression\/16.0.html\n@@ -0,0 +1,38 @@\n+<!DOCTYPE html>\n+<html>\n+ <head>\n+ <meta charset=\"UTF-8\" \/>\n+ <title>React 16.0<\/title>\n+ <link rel=\"stylesheet\" href=\"styles.css\" \/>\n+\n+ <script type=\"text\/javascript\">\n+ \/\/ Enable DevTools to inspect React inside of an <iframe>\n+ \/\/ This must run before React is loaded\n+ __REACT_DEVTOOLS_GLOBAL_HOOK__ = parent.__REACT_DEVTOOLS_GLOBAL_HOOK__;\n+ <\/script>\n+\n+ <script src=\"https:\/\/unpkg.com\/react@16.0\/umd\/react.development.js\"><\/script>\n+ <script src=\"https:\/\/unpkg.com\/react-dom@16.0\/umd\/react-dom.development.js\"><\/script>\n+ \n+ \n+ <script src=\"https:\/\/unpkg.com\/babel-standalone@6\/babel.min.js\"><\/script>\n+ <\/head>\n+ <body>\n+ <div id=\"root\">\n+ If you are seeing this message, you are likely viewing this file using the <code>file<\/code> protocol which does not support cross origin requests.\n+ <br\/><br\/>\n+ Use the <code>server<\/code> script instead:\n+ <br\/><br\/>\n+ <code>node .\/fixtures\/regression\/server.js<\/code><br\/>\n+ <code>open <a href=\"http:\/\/localhost:3000\/fixtures\/regression\/16.0.html\">http:\/\/localhost:3000\/fixtures\/regression\/16.0.html<\/a><\/code>\n+ <\/div>\n+\n+ <script src=\"shared.js\" type=\"text\/babel\"><\/script>\n+\n+ \n+ <\/body>\n+<\/html>\n\\ No newline at end of file\ndiff --git a\/fixtures\/regression\/16.1.html b\/fixtures\/regression\/16.1.html\nnew file mode 100644\nindex 0000000000..d93addf46e\n--- \/dev\/null\n+++ b\/fixtures\/regression\/16.1.html\n@@ -0,0 +1,38 @@\n+<!DOCTYPE html>\n+<html>\n+ <head>\n+ <meta charset=\"UTF-8\" \/>\n+ <title>React 16.1<\/title>\n+ <link rel=\"stylesheet\" href=\"styles.css\" \/>\n+\n+ <script type=\"text\/javascript\">\n+ \/\/ Enable DevTools to inspect React inside of an <iframe>\n+ \/\/ This must run before React is loaded\n+ __REACT_DEVTOOLS_GLOBAL_HOOK__ = parent.__REACT_DEVTOOLS_GLOBAL_HOOK__;\n+ <\/script>\n+\n+ <script src=\"https:\/\/unpkg.com\/react@16.1\/umd\/react.development.js\"><\/script>\n+ <script src=\"https:\/\/unpkg.com\/react-dom@16.1\/umd\/react-dom.development.js\"><\/script>\n+ \n+ \n+ <script src=\"https:\/\/unpkg.com\/babel-standalone@6\/babel.min.js\"><\/script>\n+ <\/head>\n+ <body>\n+ <div id=\"root\">\n+ If you are seeing this message, you are likely viewing this file using the <code>file<\/code> protocol which does not support cross origin requests.\n+ <br\/><br\/>\n+ Use the <code>server<\/code> script instead:\n+ <br\/><br\/>\n+ <code>node .\/fixtures\/regression\/server.js<\/code><br\/>\n+ <code>open <a href=\"http:\/\/localhost:3000\/fixtures\/regression\/16.1.html\">http:\/\/localhost:3000\/fixtures\/regression\/16.1.html<\/a><\/code>\n+ <\/div>\n+\n+ <script src=\"shared.js\" type=\"text\/babel\"><\/script>\n+\n+ \n+ <\/body>\n+<\/html>\n\\ No newline at end of file\ndiff --git a\/fixtures\/regression\/16.2.html b\/fixtures\/regression\/16.2.html\nnew file mode 100644\nindex 0000000000..10d8e150ed\n--- \/dev\/null\n+++ b\/fixtures\/regression\/16.2.html\n@@ -0,0 +1,38 @@\n+<!DOCTYPE html>\n+<html>\n+ <head>\n+ <meta charset=\"UTF-8\" \/>\n+ <title>React 16.2<\/title>\n+ <link rel=\"stylesheet\" href=\"styles.css\" \/>\n+\n+ <script type=\"text\/javascript\">\n+ \/\/ Enable DevTools to inspect React inside of an <iframe>\n+ \/\/ This must run before React is loaded\n+ __REACT_DEVTOOLS_GLOBAL_HOOK__ = parent.__REACT_DEVTOOLS_GLOBAL_HOOK__;\n+ <\/script>\n+\n+ <script src=\"https:\/\/unpkg.com\/react@16.2\/umd\/react.development.js\"><\/script>\n+ <script src=\"https:\/\/unpkg.com\/react-dom@16.2\/umd\/react-dom.development.js\"><\/script>\n+ \n+ \n+ <script src=\"https:\/\/unpkg.com\/babel-standalone@6\/babel.min.js\"><\/script>\n+ <\/head>\n+ <body>\n+ <div id=\"root\">\n+ If you are seeing this message, you are likely viewing this file using the <code>file<\/code> protocol which does not support cross origin requests.\n+ <br\/><br\/>\n+ Use the <code>server<\/code> script instead:\n+ <br\/><br\/>\n+ <code>node .\/fixtures\/regression\/server.js<\/code><br\/>\n+ <code>open <a href=\"http:\/\/localhost:3000\/fixtures\/regression\/16.2.html\">http:\/\/localhost:3000\/fixtures\/regression\/16.2.html<\/a><\/code>\n+ <\/div>\n+\n+ <script src=\"shared.js\" type=\"text\/babel\"><\/script>\n+\n+ \n+ <\/body>\n+<\/html>\n\\ No newline at end of file\ndiff --git a\/fixtures\/regression\/16.3.html b\/fixtures\/regression\/16.3.html\nnew file mode 100644\nindex 0000000000..2e42e2813a\n--- \/dev\/null\n+++ b\/fixtures\/regression\/16.3.html\n@@ -0,0 +1,38 @@\n+<!DOCTYPE html>\n+<html>\n+ <head>\n+ <meta charset=\"UTF-8\" \/>\n+ <title>React 16.3<\/title>\n+ <link rel=\"stylesheet\" href=\"styles.css\" \/>\n+\n+ <script type=\"text\/javascript\">\n+ \/\/ Enable DevTools to inspect React inside of an <iframe>\n+ \/\/ This must run before React is loaded\n+ __REACT_DEVTOOLS_GLOBAL_HOOK__ = parent.__REACT_DEVTOOLS_GLOBAL_HOOK__;\n+ <\/script>\n+\n+ <script src=\"https:\/\/unpkg.com\/react@16.3\/umd\/react.development.js\"><\/script>\n+ <script src=\"https:\/\/unpkg.com\/react-dom@16.3\/umd\/react-dom.development.js\"><\/script>\n+ \n+ \n+ <script src=\"https:\/\/unpkg.com\/babel-standalone@6\/babel.min.js\"><\/script>\n+ <\/head>\n+ <body>\n+ <div id=\"root\">\n+ If you are seeing this message, you are likely viewing this file using the <code>file<\/code> protocol which does not support cross origin requests.\n+ <br\/><br\/>\n+ Use the <code>server<\/code> script instead:\n+ <br\/><br\/>\n+ <code>node .\/fixtures\/regression\/server.js<\/code><br\/>\n+ <code>open <a href=\"http:\/\/localhost:3000\/fixtures\/regression\/16.3.html\">http:\/\/localhost:3000\/fixtures\/regression\/16.3.html<\/a><\/code>\n+ <\/div>\n+\n+ <script src=\"shared.js\" type=\"text\/babel\"><\/script>\n+\n+ \n+ <\/body>\n+<\/html>\n\\ No newline at end of file\ndiff --git a\/fixtures\/regression\/16.4.html b\/fixtures\/regression\/16.4.html\nnew file mode 100644\nindex 0000000000..f59f4e9e6f\n--- \/dev\/null\n+++ b\/fixtures\/regression\/16.4.html\n@@ -0,0 +1,38 @@\n+<!DOCTYPE html>\n+<html>\n+ <head>\n+ <meta charset=\"UTF-8\" \/>\n+ <title>React 16.4<\/title>\n+ <link rel=\"stylesheet\" href=\"styles.css\" \/>\n+\n+ <script type=\"text\/javascript\">\n+ \/\/ Enable DevTools to inspect React inside of an <iframe>\n+ \/\/ This must run before React is loaded\n+ __REACT_DEVTOOLS_GLOBAL_HOOK__ = parent.__REACT_DEVTOOLS_GLOBAL_HOOK__;\n+ <\/script>\n+\n+ <script src=\"https:\/\/unpkg.com\/react@16.4\/umd\/react.development.js\"><\/script>\n+ <script src=\"https:\/\/unpkg.com\/react-dom@16.4\/umd\/react-dom.development.js\"><\/script>\n+ \n+ \n+ <script src=\"https:\/\/unpkg.com\/babel-standalone@6\/babel.min.js\"><\/script>\n+ <\/head>\n+ <body>\n+ <div id=\"root\">\n+ If you are seeing this message, you are likely viewing this file using the <code>file<\/code> protocol which does not support cross origin requests.\n+ <br\/><br\/>\n+ Use the <code>server<\/code> script instead:\n+ <br\/><br\/>\n+ <code>node .\/fixtures\/regression\/server.js<\/code><br\/>\n+ <code>open <a href=\"http:\/\/localhost:3000\/fixtures\/regression\/16.4.html\">http:\/\/localhost:3000\/fixtures\/regression\/16.4.html<\/a><\/code>\n+ <\/div>\n+\n+ <script src=\"shared.js\" type=\"text\/babel\"><\/script>\n+\n+ \n+ <\/body>\n+<\/html>\n\\ No newline at end of file\ndiff --git a\/fixtures\/regression\/16.5.html b\/fixtures\/regression\/16.5.html\nnew file mode 100644\nindex 0000000000..455e06f219\n--- \/dev\/null\n+++ b\/fixtures\/regression\/16.5.html\n@@ -0,0 +1,40 @@\n+<!DOCTYPE html>\n+<html>\n+ <head>\n+ <meta charset=\"UTF-8\" \/>\n+ <title>React 16.5<\/title>\n+ <link rel=\"stylesheet\" href=\"styles.css\" \/>\n+\n+ <script type=\"text\/javascript\">\n+ \/\/ Enable DevTools to inspect React inside of an <iframe>\n+ \/\/ This must run before React is loaded\n+ __REACT_DEVTOOLS_GLOBAL_HOOK__ = parent.__REACT_DEVTOOLS_GLOBAL_HOOK__;\n+ <\/script>\n+\n+ <script src=\"https:\/\/unpkg.com\/schedule@0.5.0\/umd\/schedule.development.js\"><\/script>\n+ <script src=\"https:\/\/unpkg.com\/schedule@0.5.0\/umd\/schedule-tracing.development.js\"><\/script>\n+ <script src=\"https:\/\/unpkg.com\/react@16.5\/umd\/react.development.js\"><\/script>\n+ <script src=\"https:\/\/unpkg.com\/react-dom@16.5\/umd\/react-dom.development.js\"><\/script>\n+ \n+ \n+ <script src=\"https:\/\/unpkg.com\/babel-standalone@6\/babel.min.js\"><\/script>\n+ <\/head>\n+ <body>\n+ <div id=\"root\">\n+ If you are seeing this message, you are likely viewing this file using the <code>file<\/code> protocol which does not support cross origin requests.\n+ <br\/><br\/>\n+ Use the <code>server<\/code> script instead:\n+ <br\/><br\/>\n+ <code>node .\/fixtures\/regression\/server.js<\/code><br\/>\n+ <code>open <a href=\"http:\/\/localhost:3000\/fixtures\/regression\/16.5.html\">http:\/\/localhost:3000\/fixtures\/regression\/16.5.html<\/a><\/code>\n+ <\/div>\n+\n+ <script src=\"shared.js\" type=\"text\/babel\"><\/script>\n+\n+ \n+ <\/body>\n+<\/html>\n\\ No newline at end of file\ndiff --git a\/fixtures\/regression\/16.6.html b\/fixtures\/regression\/16.6.html\nnew file mode 100644\nindex 0000000000..1f61c47f85\n--- \/dev\/null\n+++ b\/fixtures\/regression\/16.6.html\n@@ -0,0 +1,41 @@\n+<!DOCTYPE html>\n+<html>\n+ <head>\n+ <meta charset=\"UTF-8\" \/>\n+ <title>React 16.6<\/title>\n+ <link rel=\"stylesheet\" href=\"styles.css\" \/>\n+\n+ <script type=\"text\/javascript\">\n+ \/\/ Enable DevTools to inspect React inside of an <iframe>\n+ \/\/ This must run before React is loaded\n+ __REACT_DEVTOOLS_GLOBAL_HOOK__ = parent.__REACT_DEVTOOLS_GLOBAL_HOOK__;\n+ <\/script>\n+\n+ <script src=\"https:\/\/unpkg.com\/scheduler@0.10.0\/umd\/scheduler.development.js\"><\/script>\n+ <script src=\"https:\/\/unpkg.com\/scheduler@0.10.0\/umd\/scheduler-tracing.development.js\"><\/script>\n+ <script src=\"https:\/\/unpkg.com\/react@16.6\/umd\/react.development.js\"><\/script>\n+ <script src=\"https:\/\/unpkg.com\/react-dom@16.6\/umd\/react-dom.development.js\"><\/script>\n+ <script src=\"https:\/\/unpkg.com\/react-cache@2.0.0-alpha.1\/umd\/react-cache.development.js\"><\/script>\n+ \n+ \n+ <script src=\"https:\/\/unpkg.com\/babel-standalone@6\/babel.min.js\"><\/script>\n+ <\/head>\n+ <body>\n+ <div id=\"root\">\n+ If you are seeing this message, you are likely viewing this file using the <code>file<\/code> protocol which does not support cross origin requests.\n+ <br\/><br\/>\n+ Use the <code>server<\/code> script instead:\n+ <br\/><br\/>\n+ <code>node .\/fixtures\/regression\/server.js<\/code><br\/>\n+ <code>open <a href=\"http:\/\/localhost:3000\/fixtures\/regression\/16.6.html\">http:\/\/localhost:3000\/fixtures\/regression\/16.6.html<\/a><\/code>\n+ <\/div>\n+\n+ <script src=\"shared.js\" type=\"text\/babel\"><\/script>\n+\n+ \n+ <\/body>\n+<\/html>\n\\ No newline at end of file\ndiff --git a\/fixtures\/regression\/16.7.html b\/fixtures\/regression\/16.7.html\nnew file mode 100644\nindex 0000000000..d839d7e030\n--- \/dev\/null\n+++ b\/fixtures\/regression\/16.7.html\n@@ -0,0 +1,41 @@\n+<!DOCTYPE html>\n+<html>\n+ <head>\n+ <meta charset=\"UTF-8\" \/>\n+ <title>React 16.7<\/title>\n+ <link rel=\"stylesheet\" href=\"styles.css\" \/>\n+\n+ <script type=\"text\/javascript\">\n+ \/\/ Enable DevTools to inspect React inside of an <iframe>\n+ \/\/ This must run before React is loaded\n+ __REACT_DEVTOOLS_GLOBAL_HOOK__ = parent.__REACT_DEVTOOLS_GLOBAL_HOOK__;\n+ <\/script>\n+\n+ <script src=\"https:\/\/unpkg.com\/scheduler@0.12.0\/umd\/scheduler.development.js\"><\/script>\n+ <script src=\"https:\/\/unpkg.com\/scheduler@0.12.0\/umd\/scheduler-tracing.development.js\"><\/script>\n+ <script src=\"https:\/\/unpkg.com\/react@16.7\/umd\/react.development.js\"><\/script>\n+ <script src=\"https:\/\/unpkg.com\/react-dom@16.7\/umd\/react-dom.development.js\"><\/script>\n+ <script src=\"https:\/\/unpkg.com\/react-cache@2.0.0-alpha.1\/umd\/react-cache.development.js\"><\/script>\n+ \n+ \n+ <script src=\"https:\/\/unpkg.com\/babel-standalone@6\/babel.min.js\"><\/script>\n+ <\/head>\n+ <body>\n+ <div id=\"root\">\n+ If you are seeing this message, you are likely viewing this file using the <code>file<\/code> protocol which does not support cross origin requests.\n+ <br\/><br\/>\n+ Use the <code>server<\/code> script instead:\n+ <br\/><br\/>\n+ <code>node .\/fixtures\/regression\/server.js<\/code><br\/>\n+ <code>open <a href=\"http:\/\/localhost:3000\/fixtures\/regression\/16.7.html\">http:\/\/localhost:3000\/fixtures\/regression\/16.7.html<\/a><\/code>\n+ <\/div>\n+\n+ <script src=\"shared.js\" type=\"text\/babel\"><\/script>\n+\n+ \n+ <\/body>\n+<\/html>\n\\ No newline at end of file\ndiff --git a\/fixtures\/regression\/canary.html b\/fixtures\/regression\/canary.html\nnew file mode 100644\nindex 0000000000..ab59d7029e\n--- \/dev\/null\n+++ b\/fixtures\/regression\/canary.html\n@@ -0,0 +1,41 @@\n+<!DOCTYPE html>\n+<html>\n+ <head>\n+ <meta charset=\"UTF-8\" \/>\n+ <title>React canary<\/title>\n+ <link rel=\"stylesheet\" href=\"styles.css\" \/>\n+\n+ <script type=\"text\/javascript\">\n+ \/\/ Enable DevTools to inspect React inside of an <iframe>\n+ \/\/ This must run before React is loaded\n+ __REACT_DEVTOOLS_GLOBAL_HOOK__ = parent.__REACT_DEVTOOLS_GLOBAL_HOOK__;\n+ <\/script>\n+\n+ <script src=\"https:\/\/unpkg.com\/scheduler@canary\/umd\/scheduler.development.js\"><\/script>\n+ <script src=\"https:\/\/unpkg.com\/scheduler@canary\/umd\/scheduler-tracing.development.js\"><\/script>\n+ <script src=\"https:\/\/unpkg.com\/react@canary\/umd\/react.development.js\"><\/script>\n+ <script src=\"https:\/\/unpkg.com\/react-dom@canary\/umd\/react-dom.development.js\"><\/script>\n+ <script src=\"https:\/\/unpkg.com\/react-cache@next\/umd\/react-cache.development.js\"><\/script>\n+ \n+ \n+ <script src=\"https:\/\/unpkg.com\/babel-standalone@6\/babel.min.js\"><\/script>\n+ <\/head>\n+ <body>\n+ <div id=\"root\">\n+ If you are seeing this message, you are likely viewing this file using the <code>file<\/code> protocol which does not support cross origin requests.\n+ <br\/><br\/>\n+ Use the <code>server<\/code> script instead:\n+ <br\/><br\/>\n+ <code>node .\/fixtures\/regression\/server.js<\/code><br\/>\n+ <code>open <a href=\"http:\/\/localhost:3000\/fixtures\/regression\/canary.html\">http:\/\/localhost:3000\/fixtures\/regression\/canary.html<\/a><\/code>\n+ <\/div>\n+\n+ <script src=\"shared.js\" type=\"text\/babel\"><\/script>\n+\n+ \n+ <\/body>\n+<\/html>\n\\ No newline at end of file\ndiff --git a\/fixtures\/regression\/index.html b\/fixtures\/regression\/index.html\nnew file mode 100644\nindex 0000000000..125a8e8baf\n--- \/dev\/null\n+++ b\/fixtures\/regression\/index.html\n@@ -0,0 +1,28 @@\n+<!DOCTYPE html>\n+<html>\n+ <head>\n+ <meta charset=\"UTF-8\" \/>\n+ <title>React DevTools regression test<\/title>\n+ <link rel=\"stylesheet\" href=\"styles.css\" \/>\n+ <\/head>\n+ <body>\n+ <iframe src=\"canary.html\"><\/iframe>\n+ <iframe src=\"next.html\"><\/iframe>\n+ <iframe src=\"16.7.html\"><\/iframe>\n+ <iframe src=\"16.6.html\"><\/iframe>\n+ <iframe src=\"16.5.html\"><\/iframe>\n+ <iframe src=\"16.4.html\"><\/iframe>\n+ <iframe src=\"16.3.html\"><\/iframe>\n+ <iframe src=\"16.2.html\"><\/iframe>\n+ <iframe src=\"16.1.html\"><\/iframe>\n+ <iframe src=\"16.0.html\"><\/iframe>\n+ <iframe src=\"15.6.html\"><\/iframe>\n+ <iframe src=\"15.5.html\"><\/iframe>\n+ <iframe src=\"15.4.html\"><\/iframe>\n+ <iframe src=\"15.3.html\"><\/iframe>\n+ <iframe src=\"15.2.html\"><\/iframe>\n+ <iframe src=\"15.1.html\"><\/iframe>\n+ <iframe src=\"15.0.html\"><\/iframe>\n+ <iframe src=\"14.9.html\"><\/iframe>\n+ <\/body>\n+<\/html>\n\\ No newline at end of file\ndiff --git a\/fixtures\/regression\/next.html b\/fixtures\/regression\/next.html\nnew file mode 100644\nindex 0000000000..77bb9bbed2\n--- \/dev\/null\n+++ b\/fixtures\/regression\/next.html\n@@ -0,0 +1,41 @@\n+<!DOCTYPE html>\n+<html>\n+ <head>\n+ <meta charset=\"UTF-8\" \/>\n+ <title>React next<\/title>\n+ <link rel=\"stylesheet\" href=\"styles.css\" \/>\n+\n+ <script type=\"text\/javascript\">\n+ \/\/ Enable DevTools to inspect React inside of an <iframe>\n+ \/\/ This must run before React is loaded\n+ __REACT_DEVTOOLS_GLOBAL_HOOK__ = parent.__REACT_DEVTOOLS_GLOBAL_HOOK__;\n+ <\/script>\n+\n+ <script src=\"https:\/\/unpkg.com\/scheduler@next\/umd\/scheduler.development.js\"><\/script>\n+ <script src=\"https:\/\/unpkg.com\/scheduler@next\/umd\/scheduler-tracing.development.js\"><\/script>\n+ <script src=\"https:\/\/unpkg.com\/react@next\/umd\/react.development.js\"><\/script>\n+ <script src=\"https:\/\/unpkg.com\/react-dom@next\/umd\/react-dom.development.js\"><\/script>\n+ <script src=\"https:\/\/unpkg.com\/react-cache@next\/umd\/react-cache.development.js\"><\/script>\n+ \n+ \n+ <script src=\"https:\/\/unpkg.com\/babel-standalone@6\/babel.min.js\"><\/script>\n+ <\/head>\n+ <body>\n+ <div id=\"root\">\n+ If you are seeing this message, you are likely viewing this file using the <code>file<\/code> protocol which does not support cross origin requests.\n+ <br\/><br\/>\n+ Use the <code>server<\/code> script instead:\n+ <br\/><br\/>\n+ <code>node .\/fixtures\/regression\/server.js<\/code><br\/>\n+ <code>open <a href=\"http:\/\/localhost:3000\/fixtures\/regression\/next.html\">http:\/\/localhost:3000\/fixtures\/regression\/next.html<\/a><\/code>\n+ <\/div>\n+\n+ <script src=\"shared.js\" type=\"text\/babel\"><\/script>\n+\n+ \n+ <\/body>\n+<\/html>\n\\ No newline at end of file\ndiff --git a\/fixtures\/regression\/server.js b\/fixtures\/regression\/server.js\nnew file mode 100755\nindex 0000000000..f7e03f075d\n--- \/dev\/null\n+++ b\/fixtures\/regression\/server.js\n@@ -0,0 +1,16 @@\n+#!\/usr\/bin\/env node\n+\n+const finalhandler = require('finalhandler');\n+const http = require('http');\n+const serveStatic = require('serve-static');\n+\n+\/\/ Serve fixtures folder\n+const serve = serveStatic(__dirname, { index: 'index.html' });\n+\n+\/\/ Create server\n+const server = http.createServer(function onRequest(req, res) {\n+ serve(req, res, finalhandler(req, res));\n+});\n+\n+\/\/ Listen\n+server.listen(3000);\ndiff --git a\/fixtures\/regression\/shared.js b\/fixtures\/regression\/shared.js\nnew file mode 100644\nindex 0000000000..2afd063b6b\n--- \/dev\/null\n+++ b\/fixtures\/regression\/shared.js\n@@ -0,0 +1,330 @@\n+\/* eslint-disable no-fallthrough, react\/react-in-jsx-scope, react\/jsx-no-undef *\/\n+\/* global React ReactCache ReactDOM SchedulerTracing ScheduleTracing *\/\n+\n+const apps = [];\n+\n+const pieces = React.version.split('.');\n+const major =\n+ pieces[0] === '0' ? parseInt(pieces[1], 10) : parseInt(pieces[0], 10);\n+const minor =\n+ pieces[0] === '0' ? parseInt(pieces[2], 10) : parseInt(pieces[1], 10);\n+\n+\/\/ Convenience wrapper to organize API features in DevTools.\n+function Feature({ children, label, version }) {\n+ return (\n+ <div className=\"Feature\">\n+ <div className=\"FeatureHeader\">\n+ <code className=\"FeatureCode\">{label}<\/code>\n+ <small>{version}<\/small>\n+ <\/div>\n+ {children}\n+ <\/div>\n+ );\n+}\n+\n+\/\/ Simplify interaction tracing for tests below.\n+let trace = null;\n+if (typeof SchedulerTracing !== 'undefined') {\n+ trace = SchedulerTracing.unstable_trace;\n+} else if (typeof ScheduleTracing !== 'undefined') {\n+ trace = ScheduleTracing.unstable_trace;\n+} else {\n+ trace = (_, __, callback) => callback();\n+}\n+\n+\/\/ https:\/\/github.com\/facebook\/react\/blob\/master\/CHANGELOG.md\n+switch (major) {\n+ case 16:\n+ switch (minor) {\n+ case 7:\n+ if (typeof React.useState === 'function') {\n+ \/\/ Hooks\n+ function Hooks() {\n+ const [count, setCount] = React.useState(0);\n+ const incrementCount = React.useCallback(\n+ () => setCount(count + 1),\n+ [count]\n+ );\n+ return (\n+ <div>\n+ count: {count}{' '}\n+ <button onClick={incrementCount}>increment<\/button>\n+ <\/div>\n+ );\n+ }\n+ apps.push(\n+ <Feature key=\"Hooks\" label=\"Hooks\" version=\"16.7+\">\n+ <Hooks \/>\n+ <\/Feature>\n+ );\n+ }\n+ case 6:\n+ \/\/ memo\n+ function LabelComponent({ label }) {\n+ return <label>{label}<\/label>;\n+ }\n+ const AnonymousMemoized = React.memo(({ label }) => (\n+ <label>{label}<\/label>\n+ ));\n+ const Memoized = React.memo(LabelComponent);\n+ const CustomMemoized = React.memo(LabelComponent);\n+ CustomMemoized.displayName = 'MemoizedLabelFunction';\n+ apps.push(\n+ <Feature key=\"memo\" label=\"memo\" version=\"16.6+\">\n+ <AnonymousMemoized label=\"AnonymousMemoized\" \/>\n+ <Memoized label=\"Memoized\" \/>\n+ <CustomMemoized label=\"CustomMemoized\" \/>\n+ <\/Feature>\n+ );\n+\n+ \/\/ Suspense\n+ const loadResource = ([text, ms]) => {\n+ return new Promise((resolve, reject) => {\n+ setTimeout(() => {\n+ resolve(text);\n+ }, ms);\n+ });\n+ };\n+ const getResourceKey = ([text, ms]) => text;\n+ const Resource = ReactCache.unstable_createResource(\n+ loadResource,\n+ getResourceKey\n+ );\n+ class Suspending extends React.Component {\n+ state = { useSuspense: false };\n+ useSuspense = () => this.setState({ useSuspense: true });\n+ render() {\n+ if (this.state.useSuspense) {\n+ const text = Resource.read(['loaded', 2000]);\n+ return text;\n+ } else {\n+ return <button onClick={this.useSuspense}>load data<\/button>;\n+ }\n+ }\n+ }\n+ apps.push(\n+ <Feature key=\"Suspense\" label=\"Suspense\" version=\"16.6+\">\n+ <React.Suspense fallback={<div>loading...<\/div>}>\n+ <Suspending \/>\n+ <\/React.Suspense>\n+ <\/Feature>\n+ );\n+\n+ \/\/ lazy\n+ const LazyWithDefaultProps = React.lazy(\n+ () =>\n+ new Promise(resolve => {\n+ function FooWithDefaultProps(props) {\n+ return (\n+ <h1>\n+ {props.greeting}, {props.name}\n+ <\/h1>\n+ );\n+ }\n+ FooWithDefaultProps.defaultProps = {\n+ name: 'World',\n+ greeting: 'Bonjour',\n+ };\n+ resolve({\n+ default: FooWithDefaultProps,\n+ });\n+ })\n+ );\n+ apps.push(\n+ <Feature key=\"lazy\" label=\"lazy\" version=\"16.6+\">\n+ <React.Suspense fallback={<div>loading...<\/div>}>\n+ <LazyWithDefaultProps greeting=\"Hello\" \/>\n+ <\/React.Suspense>\n+ <\/Feature>\n+ );\n+ case 5:\n+ case 4:\n+ \/\/ unstable_Profiler\n+ class ProfilerChild extends React.Component {\n+ state = { count: 0 };\n+ incrementCount = () =>\n+ this.setState(prevState => ({ count: prevState.count + 1 }));\n+ render() {\n+ return (\n+ <div>\n+ count: {this.state.count}{' '}\n+ <button onClick={this.incrementCount}>increment<\/button>\n+ <\/div>\n+ );\n+ }\n+ }\n+ const onRender = (...args) => {};\n+ const Profiler = React.unstable_Profiler || React.Profiler;\n+ apps.push(\n+ <Feature\n+ key=\"unstable_Profiler\"\n+ label=\"unstable_Profiler\"\n+ version=\"16.4+\"\n+ >\n+ <Profiler id=\"count\" onRender={onRender}>\n+ <div>\n+ <ProfilerChild \/>\n+ <\/div>\n+ <\/Profiler>\n+ <\/Feature>\n+ );\n+ case 3:\n+ \/\/ createContext()\n+ const LocaleContext = React.createContext();\n+ LocaleContext.displayName = 'LocaleContext';\n+ const ThemeContext = React.createContext();\n+ apps.push(\n+ <Feature key=\"createContext\" label=\"createContext\" version=\"16.3+\">\n+ <ThemeContext.Provider value=\"blue\">\n+ <ThemeContext.Consumer>\n+ {theme => <div>theme: {theme}<\/div>}\n+ <\/ThemeContext.Consumer>\n+ <\/ThemeContext.Provider>\n+ <LocaleContext.Provider value=\"en-US\">\n+ <LocaleContext.Consumer>\n+ {locale => <div>locale: {locale}<\/div>}\n+ <\/LocaleContext.Consumer>\n+ <\/LocaleContext.Provider>\n+ <\/Feature>\n+ );\n+\n+ \/\/ forwardRef()\n+ const AnonymousFunction = React.forwardRef((props, ref) => (\n+ <div ref={ref}>{props.children}<\/div>\n+ ));\n+ const NamedFunction = React.forwardRef(function named(props, ref) {\n+ return <div ref={ref}>{props.children}<\/div>;\n+ });\n+ const CustomName = React.forwardRef((props, ref) => (\n+ <div ref={ref}>{props.children}<\/div>\n+ ));\n+ CustomName.displayName = 'CustomNameForwardRef';\n+ apps.push(\n+ <Feature key=\"forwardRef\" label=\"forwardRef\" version=\"16.3+\">\n+ <AnonymousFunction>AnonymousFunction<\/AnonymousFunction>\n+ <NamedFunction>NamedFunction<\/NamedFunction>\n+ <CustomName>CustomName<\/CustomName>\n+ <\/Feature>\n+ );\n+\n+ \/\/ StrictMode\n+ class StrictModeChild extends React.Component {\n+ render() {\n+ return 'StrictModeChild';\n+ }\n+ }\n+ apps.push(\n+ <Feature key=\"StrictMode\" label=\"StrictMode\" version=\"16.3+\">\n+ <React.StrictMode>\n+ <StrictModeChild \/>\n+ <\/React.StrictMode>\n+ <\/Feature>\n+ );\n+\n+ \/\/ unstable_AsyncMode (later renamed to unstable_ConcurrentMode, then ConcurrentMode)\n+ const ConcurrentMode =\n+ React.ConcurrentMode ||\n+ React.unstable_ConcurrentMode ||\n+ React.unstable_AsyncMode;\n+ apps.push(\n+ <Feature\n+ key=\"AsyncMode\/ConcurrentMode\"\n+ label=\"AsyncMode\/ConcurrentMode\"\n+ version=\"16.3+\"\n+ >\n+ <ConcurrentMode>\n+ <div>\n+ unstable_AsyncMode was added in 16.3, renamed to\n+ unstable_ConcurrentMode in 16.5, and then renamed to\n+ ConcurrentMode in 16.7\n+ <\/div>\n+ <\/ConcurrentMode>\n+ <\/Feature>\n+ );\n+ case 2:\n+ \/\/ Fragment\n+ apps.push(\n+ <Feature key=\"Fragment\" label=\"Fragment\" version=\"16.4+\">\n+ <React.Fragment>\n+ <div>one<\/div>\n+ <div>two<\/div>\n+ <\/React.Fragment>\n+ <\/Feature>\n+ );\n+ case 1:\n+ case 0:\n+ default:\n+ break;\n+ }\n+ break;\n+ case 15:\n+ break;\n+ case 14:\n+ break;\n+ default:\n+ break;\n+}\n+\n+function Even() {\n+ return <small>(even)<\/small>;\n+}\n+\n+\/\/ Simple stateful app shared by all React versions\n+class SimpleApp extends React.Component {\n+ state = { count: 0 };\n+ incrementCount = () => {\n+ const updaterFn = prevState => ({ count: prevState.count + 1 });\n+ trace('Updating count', performance.now(), () => this.setState(updaterFn));\n+ };\n+ render() {\n+ const { count } = this.state;\n+ return (\n+ <div>\n+ {count % 2 === 0 ? (\n+ <span>\n+ count: {count} <Even \/>\n+ <\/span>\n+ ) : (\n+ <span>count: {count}<\/span>\n+ )}{' '}\n+ <button onClick={this.incrementCount}>increment<\/button>\n+ <\/div>\n+ );\n+ }\n+}\n+apps.push(\n+ <Feature key=\"Simple stateful app\" label=\"Simple stateful app\" version=\"any\">\n+ <SimpleApp \/>\n+ <\/Feature>\n+);\n+\n+\/\/ This component, with the version prop, helps organize DevTools at a glance.\n+function TopLevelWrapperForDevTools({ version }) {\n+ let header = <h1>React {version}<\/h1>;\n+ if (version.includes('canary')) {\n+ const commitSha = version.match(\/.+canary-(.+)\/)[1];\n+ header = (\n+ <h1>\n+ React canary{' '}\n+ <a href={`https:\/\/github.com\/facebook\/react\/commit\/${commitSha}`}>\n+ {commitSha}\n+ <\/a>\n+ <\/h1>\n+ );\n+ } else if (version.includes('alpha')) {\n+ header = <h1>React next<\/h1>;\n+ }\n+\n+ return (\n+ <div>\n+ {header}\n+ {apps}\n+ <\/div>\n+ );\n+}\n+TopLevelWrapperForDevTools.displayName = 'React';\n+\n+ReactDOM.render(\n+ <TopLevelWrapperForDevTools version={React.version} \/>,\n+ document.getElementById('root')\n+);\ndiff --git a\/fixtures\/regression\/styles.css b\/fixtures\/regression\/styles.css\nnew file mode 100644\nindex 0000000000..6cbaaa5c01\n--- \/dev\/null\n+++ b\/fixtures\/regression\/styles.css\n@@ -0,0 +1,37 @@\n+body {\n+ font-family: sans-serif;\n+ font-size: 12px;\n+}\n+\n+h1 {\n+ margin: 0;\n+ font-size: 20px;\n+}\n+\n+h2 {\n+ margin: 1rem 0 0;\n+}\n+\n+iframe {\n+ border: 1px solid #ddd;\n+ border-radius: 0.5rem;\n+}\n+\n+code {\n+ white-space: nowrap;\n+}\n+\n+.Feature {\n+ margin: 1rem 0;\n+ border-bottom: 1px solid #eee;\n+ padding-bottom: 1rem;\n+}\n+.FeatureHeader {\n+ font-size: 16px;\n+ margin-bottom: 0.5rem;\n+}\n+.FeatureCode {\n+ background-color: #eee;\n+ padding: 0.25rem;\n+ border-radius: 0.25rem;\n+}\ndiff --git a\/flow-typed\/jest.js b\/flow-typed\/jest.js\nindex df83ee3ca3..8563e20d93 100644\n--- a\/flow-typed\/jest.js\n+++ b\/flow-typed\/jest.js\n@@ -133,11 +133,13 @@ type JestPromiseType = {\n * Use rejects to unwrap the reason of a rejected promise so any other\n * matcher can be chained. If the promise is fulfilled the assertion fails.\n *\/\n+ \/\/ eslint-disable-next-line no-use-before-define\n rejects: JestExpectType,\n \/**\n * Use resolves to unwrap the value of a fulfilled promise so any other\n * matcher can be chained. If the promise is rejected the assertion fails.\n *\/\n+ \/\/ eslint-disable-next-line no-use-before-define\n resolves: JestExpectType,\n };\n \n@@ -1085,8 +1087,10 @@ type JestPrettyFormatColors = {\n };\n \n type JestPrettyFormatIndent = string => string;\n+\/\/ eslint-disable-next-line no-unused-vars\n type JestPrettyFormatRefs = Array<any>;\n type JestPrettyFormatPrint = any => string;\n+\/\/ eslint-disable-next-line no-unused-vars\n type JestPrettyFormatStringOrNull = string | null;\n \n type JestPrettyFormatOptions = {|\n@@ -1097,6 +1101,7 @@ type JestPrettyFormatOptions = {|\n indent: number,\n maxDepth: number,\n min: boolean,\n+ \/\/ eslint-disable-next-line no-use-before-define\n plugins: JestPrettyFormatPlugins,\n printFunctionName: boolean,\n spacing: string,\ndiff --git a\/package.json b\/package.json\nindex 9e9dbc8332..f9bb136be5 100644\n--- a\/package.json\n+++ b\/package.json\n@@ -28,7 +28,7 @@\n \"<rootDir>\/src\/__tests__\/storeSerializer\"\n ],\n \"testMatch\": [\n- \"**\/__tests__\/*-test.js\"\n+ \"**\/__tests__\/**\/*-test.js\"\n ]\n },\n \"scripts\": {\n@@ -132,8 +132,10 @@\n \"prettier\": \"^1.16.4\",\n \"prop-types\": \"^15.6.2\",\n \"react\": \"^0.0.0-50b50c26f\",\n+ \"react-15\": \"npm:react@^15\",\n \"react-color\": \"^2.11.7\",\n \"react-dom\": \"^0.0.0-50b50c26f\",\n+ \"react-dom-15\": \"npm:react-dom@^15\",\n \"react-is\": \"^0.0.0-50b50c26f\",\n \"react-test-renderer\": \"^0.0.0-50b50c26f\",\n \"react-virtualized-auto-sizer\": \"^1.0.2\",\n@@ -142,6 +144,7 @@\n \"rimraf\": \"^2.6.3\",\n \"scheduler\": \"^0.0.0-50b50c26f\",\n \"semver\": \"^5.5.1\",\n+ \"serve-static\": \"^1.14.1\",\n \"style-loader\": \"^0.23.1\",\n \"web-ext\": \"^3.0.0\",\n \"webpack\": \"^4.26.0\",\ndiff --git a\/src\/__tests__\/legacy\/__snapshots__\/storeLegacy-v15-test.js.snap b\/src\/__tests__\/legacy\/__snapshots__\/storeLegacy-v15-test.js.snap\nnew file mode 100644\nindex 0000000000..d43112d058\n--- \/dev\/null\n+++ b\/src\/__tests__\/legacy\/__snapshots__\/storeLegacy-v15-test.js.snap\n@@ -0,0 +1,498 @@\n+\/\/ Jest Snapshot v1, https:\/\/goo.gl\/fbAQLP\n+\n+exports[`Store (legacy) collapseNodesByDefault:false should not filter DOM nodes from the store tree: 1: mount 1`] = `\n+[root]\n+ ▾ <Grandparent>\n+ ▾ <div>\n+ ▾ <div>\n+ ▾ <Parent>\n+ ▾ <div>\n+ ▾ <Child>\n+ <div>\n+ ▾ <Parent>\n+ ▾ <div>\n+ ▾ <Child>\n+ <div>\n+ <Nothing>\n+`;\n+\n+exports[`Store (legacy) collapseNodesByDefault:false should not filter DOM nodes from the store tree: 2: update 1`] = `\n+[root]\n+ ▾ <Grandparent>\n+ ▾ <div>\n+ ▾ <div>\n+ ▾ <Parent>\n+ ▾ <div>\n+ ▾ <Child>\n+ <div>\n+ ▾ <Parent>\n+ ▾ <div>\n+ ▾ <Child>\n+ <div>\n+ <Nothing>\n+`;\n+\n+exports[`Store (legacy) collapseNodesByDefault:false should not filter DOM nodes from the store tree: 5: unmount 1`] = ``;\n+\n+exports[`Store (legacy) collapseNodesByDefault:false should support adding and removing children: 1: mount 1`] = `\n+[root]\n+ ▾ <Root>\n+ ▾ <div>\n+ ▾ <Component key=\"a\">\n+ <div>\n+`;\n+\n+exports[`Store (legacy) collapseNodesByDefault:false should support adding and removing children: 2: add child 1`] = `\n+[root]\n+ ▾ <Root>\n+ ▾ <div>\n+ ▾ <Component key=\"a\">\n+ <div>\n+ ▾ <Component key=\"b\">\n+ <div>\n+`;\n+\n+exports[`Store (legacy) collapseNodesByDefault:false should support adding and removing children: 3: remove child 1`] = `\n+[root]\n+ ▾ <Root>\n+ ▾ <div>\n+ ▾ <Component key=\"b\">\n+ <div>\n+`;\n+\n+exports[`Store (legacy) collapseNodesByDefault:false should support collapsing parts of the tree: 1: mount 1`] = `\n+[root]\n+ ▾ <Grandparent>\n+ ▾ <div>\n+ ▾ <Parent>\n+ ▾ <div>\n+ ▾ <Child key=\"0\">\n+ <div>\n+ ▾ <Child key=\"1\">\n+ <div>\n+ ▾ <Parent>\n+ ▾ <div>\n+ ▾ <Child key=\"0\">\n+ <div>\n+ ▾ <Child key=\"1\">\n+ <div>\n+`;\n+\n+exports[`Store (legacy) collapseNodesByDefault:false should support collapsing parts of the tree: 2: collapse first Parent 1`] = `\n+[root]\n+ ▾ <Grandparent>\n+ ▾ <div>\n+ ▸ <Parent>\n+ ▾ <Parent>\n+ ▾ <div>\n+ ▾ <Child key=\"0\">\n+ <div>\n+ ▾ <Child key=\"1\">\n+ <div>\n+`;\n+\n+exports[`Store (legacy) collapseNodesByDefault:false should support collapsing parts of the tree: 3: collapse second Parent 1`] = `\n+[root]\n+ ▾ <Grandparent>\n+ ▾ <div>\n+ ▸ <Parent>\n+ ▸ <Parent>\n+`;\n+\n+exports[`Store (legacy) collapseNodesByDefault:false should support collapsing parts of the tree: 4: expand first Parent 1`] = `\n+[root]\n+ ▾ <Grandparent>\n+ ▾ <div>\n+ ▾ <Parent>\n+ ▾ <div>\n+ ▾ <Child key=\"0\">\n+ <div>\n+ ▾ <Child key=\"1\">\n+ <div>\n+ ▸ <Parent>\n+`;\n+\n+exports[`Store (legacy) collapseNodesByDefault:false should support collapsing parts of the tree: 5: collapse Grandparent 1`] = `\n+[root]\n+ ▸ <Grandparent>\n+`;\n+\n+exports[`Store (legacy) collapseNodesByDefault:false should support collapsing parts of the tree: 6: expand Grandparent 1`] = `\n+[root]\n+ ▾ <Grandparent>\n+ ▾ <div>\n+ ▾ <Parent>\n+ ▾ <div>\n+ ▾ <Child key=\"0\">\n+ <div>\n+ ▾ <Child key=\"1\">\n+ <div>\n+ ▸ <Parent>\n+`;\n+\n+exports[`Store (legacy) collapseNodesByDefault:false should support mount and update operations for multiple roots: 1: mount 1`] = `\n+[root]\n+ ▾ <Parent key=\"A\">\n+ ▾ <div>\n+ ▾ <Child key=\"0\">\n+ <div>\n+ ▾ <Child key=\"1\">\n+ <div>\n+ ▾ <Child key=\"2\">\n+ <div>\n+[root]\n+ ▾ <Parent key=\"B\">\n+ ▾ <div>\n+ ▾ <Child key=\"0\">\n+ <div>\n+ ▾ <Child key=\"1\">\n+ <div>\n+`;\n+\n+exports[`Store (legacy) collapseNodesByDefault:false should support mount and update operations for multiple roots: 2: update 1`] = `\n+[root]\n+ ▾ <Parent key=\"A\">\n+ ▾ <div>\n+ ▾ <Child key=\"0\">\n+ <div>\n+ ▾ <Child key=\"1\">\n+ <div>\n+ ▾ <Child key=\"2\">\n+ <div>\n+ ▾ <Child key=\"3\">\n+ <div>\n+[root]\n+ ▾ <Parent key=\"B\">\n+ ▾ <div>\n+ ▾ <Child key=\"0\">\n+ <div>\n+`;\n+\n+exports[`Store (legacy) collapseNodesByDefault:false should support mount and update operations for multiple roots: 3: unmount B 1`] = `\n+[root]\n+ ▾ <Parent key=\"A\">\n+ ▾ <div>\n+ ▾ <Child key=\"0\">\n+ <div>\n+ ▾ <Child key=\"1\">\n+ <div>\n+ ▾ <Child key=\"2\">\n+ <div>\n+ ▾ <Child key=\"3\">\n+ <div>\n+`;\n+\n+exports[`Store (legacy) collapseNodesByDefault:false should support mount and update operations for multiple roots: 4: unmount A 1`] = ``;\n+\n+exports[`Store (legacy) collapseNodesByDefault:false should support mount and update operations: 1: mount 1`] = `\n+[root]\n+ ▾ <Grandparent>\n+ ▾ <div>\n+ ▾ <Parent>\n+ ▾ <div>\n+ ▾ <Child key=\"0\">\n+ <div>\n+ ▾ <Child key=\"1\">\n+ <div>\n+ ▾ <Child key=\"2\">\n+ <div>\n+ ▾ <Child key=\"3\">\n+ <div>\n+ ▾ <Parent>\n+ ▾ <div>\n+ ▾ <Child key=\"0\">\n+ <div>\n+ ▾ <Child key=\"1\">\n+ <div>\n+ ▾ <Child key=\"2\">\n+ <div>\n+ ▾ <Child key=\"3\">\n+ <div>\n+`;\n+\n+exports[`Store (legacy) collapseNodesByDefault:false should support mount and update operations: 2: update 1`] = `\n+[root]\n+ ▾ <Grandparent>\n+ ▾ <div>\n+ ▾ <Parent>\n+ ▾ <div>\n+ ▾ <Child key=\"0\">\n+ <div>\n+ ▾ <Child key=\"1\">\n+ <div>\n+ ▾ <Parent>\n+ ▾ <div>\n+ ▾ <Child key=\"0\">\n+ <div>\n+ ▾ <Child key=\"1\">\n+ <div>\n+`;\n+\n+exports[`Store (legacy) collapseNodesByDefault:false should support mount and update operations: 3: unmount 1`] = ``;\n+\n+exports[`Store (legacy) collapseNodesByDefault:false should support reordering of children: 1: mount 1`] = `\n+[root]\n+ ▾ <Root>\n+ ▾ <div>\n+ ▾ <Foo key=\"foo\">\n+ ▾ <div>\n+ ▾ <Component key=\"0\">\n+ <div>\n+ ▾ <Bar key=\"bar\">\n+ ▾ <div>\n+ ▾ <Component key=\"0\">\n+ <div>\n+ ▾ <Component key=\"1\">\n+ <div>\n+`;\n+\n+exports[`Store (legacy) collapseNodesByDefault:false should support reordering of children: 2: reorder children 1`] = `\n+[root]\n+ ▾ <Root>\n+ ▾ <div>\n+ ▾ <Bar key=\"bar\">\n+ ▾ <div>\n+ ▾ <Component key=\"0\">\n+ <div>\n+ ▾ <Component key=\"1\">\n+ <div>\n+ ▾ <Foo key=\"foo\">\n+ ▾ <div>\n+ ▾ <Component key=\"0\">\n+ <div>\n+`;\n+\n+exports[`Store (legacy) collapseNodesByDefault:false should support reordering of children: 3: collapse root 1`] = `\n+[root]\n+ ▸ <Root>\n+`;\n+\n+exports[`Store (legacy) collapseNodesByDefault:false should support reordering of children: 4: expand root 1`] = `\n+[root]\n+ ▾ <Root>\n+ ▾ <div>\n+ ▾ <Bar key=\"bar\">\n+ ▾ <div>\n+ ▾ <Component key=\"0\">\n+ <div>\n+ ▾ <Component key=\"1\">\n+ <div>\n+ ▾ <Foo key=\"foo\">\n+ ▾ <div>\n+ ▾ <Component key=\"0\">\n+ <div>\n+`;\n+\n+exports[`Store (legacy) collapseNodesByDefault:true should not filter DOM nodes from the store tree: 1: mount 1`] = `\n+[root]\n+ ▸ <Grandparent>\n+`;\n+\n+exports[`Store (legacy) collapseNodesByDefault:true should not filter DOM nodes from the store tree: 2: expand Grandparent 1`] = `\n+[root]\n+ ▾ <Grandparent>\n+ ▸ <div>\n+`;\n+\n+exports[`Store (legacy) collapseNodesByDefault:true should not filter DOM nodes from the store tree: 3: expand div 1`] = `\n+[root]\n+ ▾ <Grandparent>\n+ ▾ <div>\n+ ▸ <div>\n+ ▸ <Parent>\n+ <Nothing>\n+`;\n+\n+exports[`Store (legacy) collapseNodesByDefault:true should not filter DOM nodes from the store tree: 4: final update 1`] = `\n+[root]\n+ ▾ <Grandparent>\n+ ▾ <div>\n+ ▸ <div>\n+ ▸ <Parent>\n+ <Nothing>\n+`;\n+\n+exports[`Store (legacy) collapseNodesByDefault:true should not filter DOM nodes from the store tree: 5: unmount 1`] = ``;\n+\n+exports[`Store (legacy) collapseNodesByDefault:true should support expanding deep parts of the tree: 1: mount 1`] = `\n+[root]\n+ ▸ <Wrapper>\n+`;\n+\n+exports[`Store (legacy) collapseNodesByDefault:true should support expanding deep parts of the tree: 2: expand deepest node 1`] = `\n+[root]\n+ ▾ <Wrapper>\n+ ▾ <Nested>\n+ ▾ <Nested>\n+ ▾ <Nested>\n+ ▾ <Nested>\n+ <div>\n+`;\n+\n+exports[`Store (legacy) collapseNodesByDefault:true should support expanding deep parts of the tree: 3: collapse root 1`] = `\n+[root]\n+ ▸ <Wrapper>\n+`;\n+\n+exports[`Store (legacy) collapseNodesByDefault:true should support expanding deep parts of the tree: 4: expand root 1`] = `\n+[root]\n+ ▾ <Wrapper>\n+ ▾ <Nested>\n+ ▾ <Nested>\n+ ▾ <Nested>\n+ ▾ <Nested>\n+ <div>\n+`;\n+\n+exports[`Store (legacy) collapseNodesByDefault:true should support expanding deep parts of the tree: 5: collapse middle node 1`] = `\n+[root]\n+ ▾ <Wrapper>\n+ ▸ <Nested>\n+`;\n+\n+exports[`Store (legacy) collapseNodesByDefault:true should support expanding deep parts of the tree: 6: expand middle node 1`] = `\n+[root]\n+ ▾ <Wrapper>\n+ ▾ <Nested>\n+ ▾ <Nested>\n+ ▾ <Nested>\n+ ▾ <Nested>\n+ <div>\n+`;\n+\n+exports[`Store (legacy) collapseNodesByDefault:true should support expanding parts of the tree: 1: mount 1`] = `\n+[root]\n+ ▸ <Grandparent>\n+`;\n+\n+exports[`Store (legacy) collapseNodesByDefault:true should support expanding parts of the tree: 2: expand Grandparent 1`] = `\n+[root]\n+ ▾ <Grandparent>\n+ ▸ <div>\n+`;\n+\n+exports[`Store (legacy) collapseNodesByDefault:true should support expanding parts of the tree: 3: expand parent div 1`] = `\n+[root]\n+ ▾ <Grandparent>\n+ ▾ <div>\n+ ▸ <Parent>\n+ ▸ <Parent>\n+`;\n+\n+exports[`Store (legacy) collapseNodesByDefault:true should support expanding parts of the tree: 4: expand first Parent 1`] = `\n+[root]\n+ ▾ <Grandparent>\n+ ▾ <div>\n+ ▾ <Parent>\n+ ▸ <div>\n+ ▸ <Parent>\n+`;\n+\n+exports[`Store (legacy) collapseNodesByDefault:true should support expanding parts of the tree: 5: expand second Parent 1`] = `\n+[root]\n+ ▾ <Grandparent>\n+ ▾ <div>\n+ ▾ <Parent>\n+ ▸ <div>\n+ ▾ <Parent>\n+ ▸ <div>\n+`;\n+\n+exports[`Store (legacy) collapseNodesByDefault:true should support expanding parts of the tree: 6: collapse first Parent 1`] = `\n+[root]\n+ ▾ <Grandparent>\n+ ▾ <div>\n+ ▸ <Parent>\n+ ▾ <Parent>\n+ ▸ <div>\n+`;\n+\n+exports[`Store (legacy) collapseNodesByDefault:true should support expanding parts of the tree: 7: collapse second Parent 1`] = `\n+[root]\n+ ▾ <Grandparent>\n+ ▾ <div>\n+ ▸ <Parent>\n+ ▸ <Parent>\n+`;\n+\n+exports[`Store (legacy) collapseNodesByDefault:true should support expanding parts of the tree: 8: collapse Grandparent 1`] = `\n+[root]\n+ ▸ <Grandparent>\n+`;\n+\n+exports[`Store (legacy) collapseNodesByDefault:true should support mount and update operations for multiple roots: 1: mount 1`] = `\n+[root]\n+ ▸ <Parent key=\"A\">\n+[root]\n+ ▸ <Parent key=\"B\">\n+`;\n+\n+exports[`Store (legacy) collapseNodesByDefault:true should support mount and update operations for multiple roots: 2: update 1`] = `\n+[root]\n+ ▸ <Parent key=\"A\">\n+[root]\n+ ▸ <Parent key=\"B\">\n+`;\n+\n+exports[`Store (legacy) collapseNodesByDefault:true should support mount and update operations for multiple roots: 3: unmount B 1`] = `\n+[root]\n+ ▸ <Parent key=\"A\">\n+`;\n+\n+exports[`Store (legacy) collapseNodesByDefault:true should support mount and update operations for multiple roots: 4: unmount A 1`] = ``;\n+\n+exports[`Store (legacy) collapseNodesByDefault:true should support mount and update operations: 1: mount 1`] = `\n+[root]\n+ ▸ <div>\n+`;\n+\n+exports[`Store (legacy) collapseNodesByDefault:true should support mount and update operations: 2: update 1`] = `\n+[root]\n+ ▸ <div>\n+`;\n+\n+exports[`Store (legacy) collapseNodesByDefault:true should support mount and update operations: 3: unmount 1`] = ``;\n+\n+exports[`Store (legacy) collapseNodesByDefault:true should support reordering of children: 1: mount 1`] = `\n+[root]\n+ ▸ <Root>\n+`;\n+\n+exports[`Store (legacy) collapseNodesByDefault:true should support reordering of children: 2: reorder children 1`] = `\n+[root]\n+ ▸ <Root>\n+`;\n+\n+exports[`Store (legacy) collapseNodesByDefault:true should support reordering of children: 3: expand root 1`] = `\n+[root]\n+ ▾ <Root>\n+ ▸ <div>\n+`;\n+\n+exports[`Store (legacy) collapseNodesByDefault:true should support reordering of children: 4: expand div 1`] = `\n+[root]\n+ ▾ <Root>\n+ ▾ <div>\n+ ▸ <Bar key=\"bar\">\n+ ▸ <Foo key=\"foo\">\n+`;\n+\n+exports[`Store (legacy) collapseNodesByDefault:true should support reordering of children: 4: expand leaves 1`] = `\n+[root]\n+ ▾ <Root>\n+ ▾ <div>\n+ ▾ <Bar key=\"bar\">\n+ ▸ <div>\n+ ▾ <Foo key=\"foo\">\n+ ▸ <div>\n+`;\n+\n+exports[`Store (legacy) collapseNodesByDefault:true should support reordering of children: 5: collapse root 1`] = `\n+[root]\n+ ▸ <Root>\n+`;\n+\n+exports[`Store (legacy) should not allow a root node to be collapsed: 1: mount 1`] = `\n+[root]\n+ ▸ <Component>\n+`;\ndiff --git a\/src\/__tests__\/legacy\/storeLegacy-v15-test.js b\/src\/__tests__\/legacy\/storeLegacy-v15-test.js\nnew file mode 100644\nindex 0000000000..fc5d373e5b\n--- \/dev\/null\n+++ b\/src\/__tests__\/legacy\/storeLegacy-v15-test.js\n@@ -0,0 +1,505 @@\n+\/\/ @flow\n+\n+describe('Store (legacy)', () => {\n+ let React;\n+ let ReactDOM;\n+ let store;\n+\n+ const act = (callback: Function) => {\n+ callback();\n+\n+ jest.runAllTimers(); \/\/ Flush Bridge operations\n+ };\n+\n+ beforeEach(() => {\n+ store = global.store;\n+\n+ \/\/ Redirect all React\/ReactDOM requires to the v15 UMD.\n+ \/\/ We use the UMD because Jest doesn't enable us to mock deep imports (e.g. \"react\/lib\/Something\").\n+ jest.mock('react', () => jest.requireActual('react-15\/dist\/react.js'));\n+ jest.mock('react-dom', () =>\n+ jest.requireActual('react-dom-15\/dist\/react-dom.js')\n+ );\n+\n+ React = require('react');\n+ ReactDOM = require('react-dom');\n+ });\n+\n+ it('should not allow a root node to be collapsed', () => {\n+ const Component = () => <div>Hi<\/div>;\n+\n+ act(() =>\n+ ReactDOM.render(<Component count={4} \/>, document.createElement('div'))\n+ );\n+ expect(store).toMatchSnapshot('1: mount');\n+\n+ expect(store.roots).toHaveLength(1);\n+\n+ const rootID = store.roots[0];\n+\n+ expect(() => store.toggleIsCollapsed(rootID, true)).toThrow(\n+ 'Root nodes cannot be collapsed'\n+ );\n+ });\n+\n+ describe('collapseNodesByDefault:false', () => {\n+ beforeEach(() => {\n+ store.collapseNodesByDefault = false;\n+ });\n+\n+ it('should support mount and update operations', () => {\n+ const Grandparent = ({ count }) => (\n+ <div>\n+ <Parent count={count} \/>\n+ <Parent count={count} \/>\n+ <\/div>\n+ );\n+ const Parent = ({ count }) => (\n+ <div>\n+ {new Array(count).fill(true).map((_, index) => (\n+ <Child key={index} \/>\n+ ))}\n+ <\/div>\n+ );\n+ const Child = () => <div>Hi!<\/div>;\n+\n+ const container = document.createElement('div');\n+\n+ act(() => ReactDOM.render(<Grandparent count={4} \/>, container));\n+ expect(store).toMatchSnapshot('1: mount');\n+\n+ act(() => ReactDOM.render(<Grandparent count={2} \/>, container));\n+ expect(store).toMatchSnapshot('2: update');\n+\n+ act(() => ReactDOM.unmountComponentAtNode(container));\n+ expect(store).toMatchSnapshot('3: unmount');\n+ });\n+\n+ it('should support mount and update operations for multiple roots', () => {\n+ const Parent = ({ count }) => (\n+ <div>\n+ {new Array(count).fill(true).map((_, index) => (\n+ <Child key={index} \/>\n+ ))}\n+ <\/div>\n+ );\n+ const Child = () => <div>Hi!<\/div>;\n+\n+ const containerA = document.createElement('div');\n+ const containerB = document.createElement('div');\n+\n+ act(() => {\n+ ReactDOM.render(<Parent key=\"A\" count={3} \/>, containerA);\n+ ReactDOM.render(<Parent key=\"B\" count={2} \/>, containerB);\n+ });\n+ expect(store).toMatchSnapshot('1: mount');\n+\n+ act(() => {\n+ ReactDOM.render(<Parent key=\"A\" count={4} \/>, containerA);\n+ ReactDOM.render(<Parent key=\"B\" count={1} \/>, containerB);\n+ });\n+ expect(store).toMatchSnapshot('2: update');\n+\n+ act(() => ReactDOM.unmountComponentAtNode(containerB));\n+ expect(store).toMatchSnapshot('3: unmount B');\n+\n+ act(() => ReactDOM.unmountComponentAtNode(containerA));\n+ expect(store).toMatchSnapshot('4: unmount A');\n+ });\n+\n+ it('should not filter DOM nodes from the store tree', () => {\n+ const Grandparent = ({ flip }) => (\n+ <div>\n+ <div>\n+ <Parent flip={flip} \/>\n+ <\/div>\n+ <Parent flip={flip} \/>\n+ <Nothing \/>\n+ <\/div>\n+ );\n+ const Parent = ({ flip }) => (\n+ <div>\n+ {flip ? 'foo' : null}\n+ <Child \/>\n+ {flip && [null, 'hello', 42]}\n+ {flip ? 'bar' : 'baz'}\n+ <\/div>\n+ );\n+ const Child = () => <div>Hi!<\/div>;\n+ const Nothing = () => null;\n+\n+ const container = document.createElement('div');\n+ act(() =>\n+ ReactDOM.render(<Grandparent count={4} flip={false} \/>, container)\n+ );\n+ expect(store).toMatchSnapshot('1: mount');\n+\n+ act(() =>\n+ ReactDOM.render(<Grandparent count={4} flip={true} \/>, container)\n+ );\n+ expect(store).toMatchSnapshot('2: update');\n+\n+ act(() => ReactDOM.unmountComponentAtNode(container));\n+ expect(store).toMatchSnapshot('5: unmount');\n+ });\n+\n+ it('should support collapsing parts of the tree', () => {\n+ const Grandparent = ({ count }) => (\n+ <div>\n+ <Parent count={count} \/>\n+ <Parent count={count} \/>\n+ <\/div>\n+ );\n+ const Parent = ({ count }) => (\n+ <div>\n+ {new Array(count).fill(true).map((_, index) => (\n+ <Child key={index} \/>\n+ ))}\n+ <\/div>\n+ );\n+ const Child = () => <div>Hi!<\/div>;\n+\n+ act(() =>\n+ ReactDOM.render(\n+ <Grandparent count={2} \/>,\n+ document.createElement('div')\n+ )\n+ );\n+ expect(store).toMatchSnapshot('1: mount');\n+\n+ const grandparentID = store.getElementIDAtIndex(0);\n+ const parentOneID = store.getElementIDAtIndex(2);\n+ const parentTwoID = store.getElementIDAtIndex(8);\n+\n+ act(() => store.toggleIsCollapsed(parentOneID, true));\n+ expect(store).toMatchSnapshot('2: collapse first Parent');\n+\n+ act(() => store.toggleIsCollapsed(parentTwoID, true));\n+ expect(store).toMatchSnapshot('3: collapse second Parent');\n+\n+ act(() => store.toggleIsCollapsed(parentOneID, false));\n+ expect(store).toMatchSnapshot('4: expand first Parent');\n+\n+ act(() => store.toggleIsCollapsed(grandparentID, true));\n+ expect(store).toMatchSnapshot('5: collapse Grandparent');\n+\n+ act(() => store.toggleIsCollapsed(grandparentID, false));\n+ expect(store).toMatchSnapshot('6: expand Grandparent');\n+ });\n+\n+ it('should support adding and removing children', () => {\n+ const Root = ({ children }) => <div>{children}<\/div>;\n+ const Component = () => <div \/>;\n+\n+ const container = document.createElement('div');\n+\n+ act(() =>\n+ ReactDOM.render(\n+ <Root>\n+ <Component key=\"a\" \/>\n+ <\/Root>,\n+ container\n+ )\n+ );\n+ expect(store).toMatchSnapshot('1: mount');\n+\n+ act(() =>\n+ ReactDOM.render(\n+ <Root>\n+ <Component key=\"a\" \/>\n+ <Component key=\"b\" \/>\n+ <\/Root>,\n+ container\n+ )\n+ );\n+ expect(store).toMatchSnapshot('2: add child');\n+\n+ act(() =>\n+ ReactDOM.render(\n+ <Root>\n+ <Component key=\"b\" \/>\n+ <\/Root>,\n+ container\n+ )\n+ );\n+ expect(store).toMatchSnapshot('3: remove child');\n+ });\n+\n+ it('should support reordering of children', () => {\n+ const Root = ({ children }) => <div>{children}<\/div>;\n+ const Component = () => <div \/>;\n+\n+ const Foo = () => <div>{[<Component key=\"0\" \/>]}<\/div>;\n+ const Bar = () => (\n+ <div>{[<Component key=\"0\" \/>, <Component key=\"1\" \/>]}<\/div>\n+ );\n+ const foo = <Foo key=\"foo\" \/>;\n+ const bar = <Bar key=\"bar\" \/>;\n+\n+ const container = document.createElement('div');\n+\n+ act(() => ReactDOM.render(<Root>{[foo, bar]}<\/Root>, container));\n+ expect(store).toMatchSnapshot('1: mount');\n+\n+ act(() => ReactDOM.render(<Root>{[bar, foo]}<\/Root>, container));\n+ expect(store).toMatchSnapshot('2: reorder children');\n+\n+ act(() => store.toggleIsCollapsed(store.getElementIDAtIndex(0), true));\n+ expect(store).toMatchSnapshot('3: collapse root');\n+\n+ act(() => store.toggleIsCollapsed(store.getElementIDAtIndex(0), false));\n+ expect(store).toMatchSnapshot('4: expand root');\n+ });\n+ });\n+\n+ describe('collapseNodesByDefault:true', () => {\n+ beforeEach(() => {\n+ store.collapseNodesByDefault = true;\n+ });\n+\n+ it('should support mount and update operations', () => {\n+ const Parent = ({ count }) => (\n+ <div>\n+ {new Array(count).fill(true).map((_, index) => (\n+ <Child key={index} \/>\n+ ))}\n+ <\/div>\n+ );\n+ const Child = () => <div>Hi!<\/div>;\n+\n+ const container = document.createElement('div');\n+\n+ act(() =>\n+ ReactDOM.render(\n+ <div>\n+ <Parent count={1} \/>\n+ <Parent count={3} \/>\n+ <\/div>,\n+ container\n+ )\n+ );\n+ expect(store).toMatchSnapshot('1: mount');\n+\n+ act(() =>\n+ ReactDOM.render(\n+ <div>\n+ <Parent count={2} \/>\n+ <Parent count={1} \/>\n+ <\/div>,\n+ container\n+ )\n+ );\n+ expect(store).toMatchSnapshot('2: update');\n+\n+ act(() => ReactDOM.unmountComponentAtNode(container));\n+ expect(store).toMatchSnapshot('3: unmount');\n+ });\n+\n+ it('should support mount and update operations for multiple roots', () => {\n+ const Parent = ({ count }) => (\n+ <div>\n+ {new Array(count).fill(true).map((_, index) => (\n+ <Child key={index} \/>\n+ ))}\n+ <\/div>\n+ );\n+ const Child = () => <div>Hi!<\/div>;\n+\n+ const containerA = document.createElement('div');\n+ const containerB = document.createElement('div');\n+\n+ act(() => {\n+ ReactDOM.render(<Parent key=\"A\" count={3} \/>, containerA);\n+ ReactDOM.render(<Parent key=\"B\" count={2} \/>, containerB);\n+ });\n+ expect(store).toMatchSnapshot('1: mount');\n+\n+ act(() => {\n+ ReactDOM.render(<Parent key=\"A\" count={4} \/>, containerA);\n+ ReactDOM.render(<Parent key=\"B\" count={1} \/>, containerB);\n+ });\n+ expect(store).toMatchSnapshot('2: update');\n+\n+ act(() => ReactDOM.unmountComponentAtNode(containerB));\n+ expect(store).toMatchSnapshot('3: unmount B');\n+\n+ act(() => ReactDOM.unmountComponentAtNode(containerA));\n+ expect(store).toMatchSnapshot('4: unmount A');\n+ });\n+\n+ it('should not filter DOM nodes from the store tree', () => {\n+ const Grandparent = ({ flip }) => (\n+ <div>\n+ <div>\n+ <Parent flip={flip} \/>\n+ <\/div>\n+ <Parent flip={flip} \/>\n+ <Nothing \/>\n+ <\/div>\n+ );\n+ const Parent = ({ flip }) => (\n+ <div>\n+ {flip ? 'foo' : null}\n+ <Child \/>\n+ {flip && [null, 'hello', 42]}\n+ {flip ? 'bar' : 'baz'}\n+ <\/div>\n+ );\n+ const Child = () => <div>Hi!<\/div>;\n+ const Nothing = () => null;\n+\n+ const container = document.createElement('div');\n+ act(() =>\n+ ReactDOM.render(<Grandparent count={4} flip={false} \/>, container)\n+ );\n+ expect(store).toMatchSnapshot('1: mount');\n+\n+ act(() => store.toggleIsCollapsed(store.getElementIDAtIndex(0), false));\n+ expect(store).toMatchSnapshot('2: expand Grandparent');\n+\n+ act(() => store.toggleIsCollapsed(store.getElementIDAtIndex(1), false));\n+ expect(store).toMatchSnapshot('3: expand div');\n+\n+ act(() =>\n+ ReactDOM.render(<Grandparent count={4} flip={true} \/>, container)\n+ );\n+ expect(store).toMatchSnapshot('4: final update');\n+\n+ act(() => ReactDOM.unmountComponentAtNode(container));\n+ expect(store).toMatchSnapshot('5: unmount');\n+ });\n+\n+ it('should support expanding parts of the tree', () => {\n+ const Grandparent = ({ count }) => (\n+ <div>\n+ <Parent count={count} \/>\n+ <Parent count={count} \/>\n+ <\/div>\n+ );\n+ const Parent = ({ count }) => (\n+ <div>\n+ {new Array(count).fill(true).map((_, index) => (\n+ <Child key={index} \/>\n+ ))}\n+ <\/div>\n+ );\n+ const Child = () => <div>Hi!<\/div>;\n+\n+ act(() =>\n+ ReactDOM.render(\n+ <Grandparent count={2} \/>,\n+ document.createElement('div')\n+ )\n+ );\n+ expect(store).toMatchSnapshot('1: mount');\n+\n+ const grandparentID = store.getElementIDAtIndex(0);\n+\n+ act(() => store.toggleIsCollapsed(grandparentID, false));\n+ expect(store).toMatchSnapshot('2: expand Grandparent');\n+\n+ const parentDivID = store.getElementIDAtIndex(1);\n+ act(() => store.toggleIsCollapsed(parentDivID, false));\n+ expect(store).toMatchSnapshot('3: expand parent div');\n+\n+ const parentOneID = store.getElementIDAtIndex(2);\n+ const parentTwoID = store.getElementIDAtIndex(3);\n+\n+ act(() => store.toggleIsCollapsed(parentOneID, false));\n+ expect(store).toMatchSnapshot('4: expand first Parent');\n+\n+ act(() => store.toggleIsCollapsed(parentTwoID, false));\n+ expect(store).toMatchSnapshot('5: expand second Parent');\n+\n+ act(() => store.toggleIsCollapsed(parentOneID, true));\n+ expect(store).toMatchSnapshot('6: collapse first Parent');\n+\n+ act(() => store.toggleIsCollapsed(parentTwoID, true));\n+ expect(store).toMatchSnapshot('7: collapse second Parent');\n+\n+ act(() => store.toggleIsCollapsed(grandparentID, true));\n+ expect(store).toMatchSnapshot('8: collapse Grandparent');\n+ });\n+\n+ it('should support expanding deep parts of the tree', () => {\n+ const Wrapper = ({ forwardedRef }) => (\n+ <Nested depth={3} forwardedRef={forwardedRef} \/>\n+ );\n+ const Nested = ({ depth, forwardedRef }) =>\n+ depth > 0 ? (\n+ <Nested depth={depth - 1} forwardedRef={forwardedRef} \/>\n+ ) : (\n+ <div ref={forwardedRef} \/>\n+ );\n+\n+ let ref = null;\n+ const refSetter = value => {\n+ ref = value;\n+ };\n+\n+ act(() =>\n+ ReactDOM.render(\n+ <Wrapper forwardedRef={refSetter} \/>,\n+ document.createElement('div')\n+ )\n+ );\n+ expect(store).toMatchSnapshot('1: mount');\n+\n+ const deepestedNodeID = global.agent.getIDForNode(ref);\n+\n+ act(() => store.toggleIsCollapsed(deepestedNodeID, false));\n+ expect(store).toMatchSnapshot('2: expand deepest node');\n+\n+ const rootID = store.getElementIDAtIndex(0);\n+\n+ act(() => store.toggleIsCollapsed(rootID, true));\n+ expect(store).toMatchSnapshot('3: collapse root');\n+\n+ act(() => store.toggleIsCollapsed(rootID, false));\n+ expect(store).toMatchSnapshot('4: expand root');\n+\n+ const id = store.getElementIDAtIndex(1);\n+\n+ act(() => store.toggleIsCollapsed(id, true));\n+ expect(store).toMatchSnapshot('5: collapse middle node');\n+\n+ act(() => store.toggleIsCollapsed(id, false));\n+ expect(store).toMatchSnapshot('6: expand middle node');\n+ });\n+\n+ it('should support reordering of children', () => {\n+ const Root = ({ children }) => <div>{children}<\/div>;\n+ const Component = () => <div \/>;\n+\n+ const Foo = () => <div>{[<Component key=\"0\" \/>]}<\/div>;\n+ const Bar = () => (\n+ <div>{[<Component key=\"0\" \/>, <Component key=\"1\" \/>]}<\/div>\n+ );\n+ const foo = <Foo key=\"foo\" \/>;\n+ const bar = <Bar key=\"bar\" \/>;\n+\n+ const container = document.createElement('div');\n+\n+ act(() => ReactDOM.render(<Root>{[foo, bar]}<\/Root>, container));\n+ expect(store).toMatchSnapshot('1: mount');\n+\n+ act(() => ReactDOM.render(<Root>{[bar, foo]}<\/Root>, container));\n+ expect(store).toMatchSnapshot('2: reorder children');\n+\n+ act(() => store.toggleIsCollapsed(store.getElementIDAtIndex(0), false));\n+ expect(store).toMatchSnapshot('3: expand root');\n+\n+ act(() => store.toggleIsCollapsed(store.getElementIDAtIndex(1), false));\n+ expect(store).toMatchSnapshot('4: expand div');\n+\n+ act(() => {\n+ store.toggleIsCollapsed(store.getElementIDAtIndex(3), false);\n+ store.toggleIsCollapsed(store.getElementIDAtIndex(2), false);\n+ });\n+ expect(store).toMatchSnapshot('4: expand leaves');\n+\n+ act(() => store.toggleIsCollapsed(store.getElementIDAtIndex(0), true));\n+ expect(store).toMatchSnapshot('5: collapse root');\n+ });\n+ });\n+});\ndiff --git a\/src\/__tests__\/utils.js b\/src\/__tests__\/utils.js\nindex 57fb2de3d3..089ddf045f 100644\n--- a\/src\/__tests__\/utils.js\n+++ b\/src\/__tests__\/utils.js\n@@ -47,17 +47,15 @@ export async function actAsync(\n \n export function beforeEachProfiling(): void {\n \/\/ Mock React's timing information so that test runs are predictable.\n- jest.mock('scheduler', () =>\n- \/\/ $FlowFixMe Flow does not konw about requireActual\n- require.requireActual('scheduler\/unstable_mock')\n- );\n+ jest.mock('scheduler', () => jest.requireActual('scheduler\/unstable_mock'));\n \n \/\/ DevTools itself uses performance.now() to offset commit times\n \/\/ so they appear relative to when profiling was started in the UI.\n- jest.spyOn(performance, 'now').mockImplementation(\n- \/\/ $FlowFixMe Flow does not konw about requireActual\n- require.requireActual('scheduler\/unstable_mock').unstable_now\n- );\n+ jest\n+ .spyOn(performance, 'now')\n+ .mockImplementation(\n+ jest.requireActual('scheduler\/unstable_mock').unstable_now\n+ );\n }\n \n export function createDisplayNameFilter(\ndiff --git a\/src\/backend\/index.js b\/src\/backend\/index.js\nindex 58045bc0a2..3e65e4c00c 100644\n--- a\/src\/backend\/index.js\n+++ b\/src\/backend\/index.js\n@@ -4,6 +4,7 @@ import type { DevToolsHook, ReactRenderer, RendererInterface } from '.\/types';\n import Agent from '.\/agent';\n \n import { attach } from '.\/renderer';\n+import { attach as attachLegacy } from '.\/legacy\/renderer';\n \n export function initBackend(\n hook: DevToolsHook,\n@@ -40,7 +41,11 @@ export function initBackend(\n \n \/\/ Inject any not-yet-injected renderers (if we didn't reload-and-profile)\n if (!rendererInterface) {\n- rendererInterface = attach(hook, id, renderer, global);\n+ if (typeof renderer.findFiberByHostInstance === 'function') {\n+ rendererInterface = attach(hook, id, renderer, global);\n+ } else {\n+ rendererInterface = attachLegacy(hook, id, renderer, global);\n+ }\n \n hook.rendererInterfaces.set(id, rendererInterface);\n }\ndiff --git a\/src\/backend\/legacy\/getData.js b\/src\/backend\/legacy\/getData.js\nnew file mode 100644\nindex 0000000000..d2fce307d3\n--- \/dev\/null\n+++ b\/src\/backend\/legacy\/getData.js\n@@ -0,0 +1,40 @@\n+\/\/ @flow\n+\n+import {\n+ ElementTypeClass,\n+ ElementTypeHostComponent,\n+ ElementTypeOtherOrUnknown,\n+} from 'src\/types';\n+import { getDisplayName } from 'src\/utils';\n+\n+import type { InternalInstance } from '.\/renderer';\n+import type { FiberData } from '..\/types';\n+\n+export default function getData(internalInstance: InternalInstance): FiberData {\n+ let displayName = null;\n+ let key = null;\n+ let type = ElementTypeOtherOrUnknown;\n+\n+ \/\/ != used deliberately here to catch undefined and null\n+ if (internalInstance._currentElement != null) {\n+ if (internalInstance._currentElement.key) {\n+ key = String(internalInstance._currentElement.key);\n+ }\n+\n+ const elementType = internalInstance._currentElement.type;\n+ if (typeof elementType === 'string') {\n+ type = ElementTypeHostComponent;\n+ displayName = elementType;\n+ } else if (typeof elementType === 'function') {\n+ \/\/ TODO: detect function components.\n+ type = ElementTypeClass;\n+ displayName = getDisplayName(elementType);\n+ }\n+ }\n+\n+ return {\n+ displayName,\n+ key,\n+ type,\n+ };\n+}\ndiff --git a\/src\/backend\/legacy\/renderer.js b\/src\/backend\/legacy\/renderer.js\nnew file mode 100644\nindex 0000000000..5ea0a9fb95\n--- \/dev\/null\n+++ b\/src\/backend\/legacy\/renderer.js\n@@ -0,0 +1,791 @@\n+\/\/ @flow\n+\n+import {\n+ ElementTypeClass,\n+ ElementTypeFunction,\n+ ElementTypeRoot,\n+ ElementTypeHostComponent,\n+ ElementTypeOtherOrUnknown,\n+} from 'src\/types';\n+import { getUID, utfEncodeString, printOperationsArray } from '..\/..\/utils';\n+import { cleanForBridge, copyWithSet } from '..\/utils';\n+import {\n+ __DEBUG__,\n+ TREE_OPERATION_ADD,\n+ TREE_OPERATION_REMOVE,\n+ TREE_OPERATION_REORDER_CHILDREN,\n+} from '..\/..\/constants';\n+import getData from '.\/getData';\n+import { decorateMany, forceUpdate, restoreMany } from '.\/utils';\n+\n+import type {\n+ DevToolsHook,\n+ GetFiberIDForNative,\n+ NativeType,\n+ PathFrame,\n+ PathMatch,\n+ RendererInterface,\n+} from '..\/types';\n+import type { ComponentFilter, ElementType } from 'src\/types';\n+import type { Owner, InspectedElement } from '..\/types';\n+\n+export type InternalInstance = Object;\n+type LegacyRenderer = Object;\n+\n+function getElementType(internalInstance: InternalInstance): ElementType {\n+ \/\/ != used deliberately here to catch undefined and null\n+ if (internalInstance._currentElement != null) {\n+ const elementType = internalInstance._currentElement.type;\n+ if (typeof elementType === 'function') {\n+ return ElementTypeClass;\n+ } else if (typeof elementType === 'string') {\n+ return ElementTypeHostComponent;\n+ }\n+ }\n+ return ElementTypeOtherOrUnknown;\n+}\n+\n+function getChildren(internalInstance: Object): Array<any> {\n+ let children = [];\n+\n+ \/\/ If the parent is a native node without rendered children, but with\n+ \/\/ multiple string children, then the `element` that gets passed in here is\n+ \/\/ a plain value -- a string or number.\n+ if (typeof internalInstance !== 'object') {\n+ \/\/ No children\n+ } else if (\n+ internalInstance._currentElement === null ||\n+ internalInstance._currentElement === false\n+ ) {\n+ \/\/ No children\n+ } else if (internalInstance._renderedComponent) {\n+ const child = internalInstance._renderedComponent;\n+ if (getElementType(child) !== ElementTypeOtherOrUnknown) {\n+ children.push(child);\n+ }\n+ } else if (internalInstance._renderedChildren) {\n+ const renderedChildren = internalInstance._renderedChildren;\n+ for (let name in renderedChildren) {\n+ const child = renderedChildren[name];\n+ if (getElementType(child) !== ElementTypeOtherOrUnknown) {\n+ children.push(child);\n+ }\n+ }\n+ }\n+ \/\/ Note: we skip the case where children are just strings or numbers\n+ \/\/ because the new DevTools skips over host text nodes anyway.\n+ return children;\n+}\n+\n+export function attach(\n+ hook: DevToolsHook,\n+ rendererID: number,\n+ renderer: LegacyRenderer,\n+ global: Object\n+): RendererInterface {\n+ const idToInternalInstanceMap: Map<number, InternalInstance> = new Map();\n+ const internalInstanceToIDMap: WeakMap<\n+ InternalInstance,\n+ number\n+ > = new WeakMap();\n+ const internalInstanceToRootIDMap: WeakMap<\n+ InternalInstance,\n+ number\n+ > = new WeakMap();\n+\n+ let getInternalIDForNative: GetFiberIDForNative = ((null: any): GetFiberIDForNative);\n+ let findNativeNodeForInternalID: (id: number) => ?NativeType;\n+\n+ if (renderer.ComponentTree) {\n+ getInternalIDForNative = (node, findNearestUnfilteredAncestor) => {\n+ const internalInstance = renderer.ComponentTree.getClosestInstanceFromNode(\n+ node\n+ );\n+ return internalInstanceToIDMap.get(internalInstance) || null;\n+ };\n+ findNativeNodeForInternalID = (id: number) => {\n+ const internalInstance = idToInternalInstanceMap.get(id);\n+ return renderer.ComponentTree.getNodeFromInstance(internalInstance);\n+ };\n+ } else if (renderer.Mount.getID && renderer.Mount.getNode) {\n+ getInternalIDForNative = (node, findNearestUnfilteredAncestor) => {\n+ \/\/ Not implemented.\n+ return null;\n+ };\n+ findNativeNodeForInternalID = (id: number) => {\n+ \/\/ Not implemented.\n+ return null;\n+ };\n+ }\n+\n+ function getID(internalInstance: InternalInstance): number {\n+ if (typeof internalInstance !== 'object') {\n+ throw new Error('Invalid internal instance: ' + internalInstance);\n+ }\n+ if (!internalInstanceToIDMap.has(internalInstance)) {\n+ const id = getUID();\n+ internalInstanceToIDMap.set(internalInstance, id);\n+ idToInternalInstanceMap.set(id, internalInstance);\n+ }\n+ return ((internalInstanceToIDMap.get(internalInstance): any): number);\n+ }\n+\n+ function areEqualArrays(a, b) {\n+ if (a.length !== b.length) {\n+ return false;\n+ }\n+ for (let i = 0; i < a.length; i++) {\n+ if (a[i] !== b[i]) {\n+ return false;\n+ }\n+ }\n+ return true;\n+ }\n+\n+ \/\/ This is shared mutable state that lets us keep track of where we are.\n+ let parentIDStack = [];\n+\n+ let oldReconcilerMethods = null;\n+ if (renderer.Reconciler) {\n+ \/\/ React 15\n+ oldReconcilerMethods = decorateMany(renderer.Reconciler, {\n+ mountComponent(fn, args) {\n+ const [internalInstance, , , hostContainerInfo] = args;\n+ if (getElementType(internalInstance) === ElementTypeOtherOrUnknown) {\n+ return fn.apply(this, args);\n+ }\n+\n+ const id = getID(internalInstance);\n+\n+ \/\/ Push the operation.\n+ const parentID =\n+ parentIDStack.length > 0\n+ ? parentIDStack[parentIDStack.length - 1]\n+ : 0;\n+ recordMount(internalInstance, id, parentID);\n+ parentIDStack.push(id);\n+\n+ \/\/ Remember the root.\n+ internalInstanceToRootIDMap.set(\n+ internalInstance,\n+ getID(hostContainerInfo._topLevelWrapper)\n+ );\n+\n+ try {\n+ const result = fn.apply(this, args);\n+ parentIDStack.pop();\n+ return result;\n+ } catch (err) {\n+ parentIDStack = [];\n+ throw err;\n+ } finally {\n+ if (parentIDStack.length === 0) {\n+ const rootID = internalInstanceToRootIDMap.get(internalInstance);\n+ if (rootID === undefined) {\n+ throw new Error('Expected to find root ID.');\n+ }\n+ flushPendingEvents(rootID);\n+ }\n+ }\n+ },\n+ performUpdateIfNecessary(fn, args) {\n+ const [internalInstance] = args;\n+ if (getElementType(internalInstance) === ElementTypeOtherOrUnknown) {\n+ return fn.apply(this, args);\n+ }\n+\n+ const id = getID(internalInstance);\n+ parentIDStack.push(id);\n+\n+ const prevChildren = getChildren(internalInstance);\n+ try {\n+ const result = fn.apply(this, args);\n+\n+ const nextChildren = getChildren(internalInstance);\n+ if (!areEqualArrays(prevChildren, nextChildren)) {\n+ \/\/ Push the operation\n+ recordReorder(internalInstance, id, nextChildren);\n+ }\n+\n+ parentIDStack.pop();\n+ return result;\n+ } catch (err) {\n+ parentIDStack = [];\n+ throw err;\n+ } finally {\n+ if (parentIDStack.length === 0) {\n+ const rootID = internalInstanceToRootIDMap.get(internalInstance);\n+ if (rootID === undefined) {\n+ throw new Error('Expected to find root ID.');\n+ }\n+ flushPendingEvents(rootID);\n+ }\n+ }\n+ },\n+ receiveComponent(fn, args) {\n+ const [internalInstance] = args;\n+ if (getElementType(internalInstance) === ElementTypeOtherOrUnknown) {\n+ return fn.apply(this, args);\n+ }\n+\n+ const id = getID(internalInstance);\n+ parentIDStack.push(id);\n+\n+ const prevChildren = getChildren(internalInstance);\n+ try {\n+ const result = fn.apply(this, args);\n+\n+ const nextChildren = getChildren(internalInstance);\n+ if (!areEqualArrays(prevChildren, nextChildren)) {\n+ \/\/ Push the operation\n+ recordReorder(internalInstance, id, nextChildren);\n+ }\n+\n+ parentIDStack.pop();\n+ return result;\n+ } catch (err) {\n+ parentIDStack = [];\n+ throw err;\n+ } finally {\n+ if (parentIDStack.length === 0) {\n+ const rootID = internalInstanceToRootIDMap.get(internalInstance);\n+ if (rootID === undefined) {\n+ throw new Error('Expected to find root ID.');\n+ }\n+ flushPendingEvents(rootID);\n+ }\n+ }\n+ },\n+ unmountComponent(fn, args) {\n+ const [internalInstance] = args;\n+ if (getElementType(internalInstance) === ElementTypeOtherOrUnknown) {\n+ return fn.apply(this, args);\n+ }\n+\n+ const id = getID(internalInstance);\n+ parentIDStack.push(id);\n+ try {\n+ const result = fn.apply(this, args);\n+ parentIDStack.pop();\n+\n+ \/\/ Push the operation.\n+ recordUnmount(internalInstance, id);\n+\n+ return result;\n+ } catch (err) {\n+ parentIDStack = [];\n+ throw err;\n+ } finally {\n+ if (parentIDStack.length === 0) {\n+ const rootID = internalInstanceToRootIDMap.get(internalInstance);\n+ if (rootID === undefined) {\n+ throw new Error('Expected to find root ID.');\n+ }\n+ flushPendingEvents(rootID);\n+ }\n+ }\n+ },\n+ });\n+ }\n+\n+ function cleanup() {\n+ if (oldReconcilerMethods !== null) {\n+ if (renderer.Component) {\n+ restoreMany(renderer.Component.Mixin, oldReconcilerMethods);\n+ } else {\n+ restoreMany(renderer.Reconciler, oldReconcilerMethods);\n+ }\n+ }\n+ oldReconcilerMethods = null;\n+ }\n+\n+ function recordMount(\n+ internalInstance: InternalInstance,\n+ id: number,\n+ parentID: number\n+ ) {\n+ const isRoot = parentID === 0;\n+\n+ if (__DEBUG__) {\n+ console.log(\n+ '%crecordMount()',\n+ 'color: green; font-weight: bold;',\n+ id,\n+ getData(internalInstance).displayName\n+ );\n+ }\n+\n+ if (isRoot) {\n+ \/\/ TODO Is this right? For all versions?\n+ const hasOwnerMetadata =\n+ internalInstance._currentElement != null &&\n+ internalInstance._currentElement._owner != null;\n+\n+ pushOperation(TREE_OPERATION_ADD);\n+ pushOperation(id);\n+ pushOperation(ElementTypeRoot);\n+ pushOperation(0); \/\/ isProfilingSupported?\n+ pushOperation(hasOwnerMetadata ? 1 : 0);\n+ } else {\n+ const { displayName, key, type } = getData(internalInstance);\n+\n+ const ownerID =\n+ internalInstance._currentElement != null &&\n+ internalInstance._currentElement._owner != null\n+ ? getID(internalInstance._currentElement._owner)\n+ : 0;\n+\n+ let displayNameStringID = getStringID(displayName);\n+ let keyStringID = getStringID(key);\n+ pushOperation(TREE_OPERATION_ADD);\n+ pushOperation(id);\n+ pushOperation(type);\n+ pushOperation(parentID);\n+ pushOperation(ownerID);\n+ pushOperation(displayNameStringID);\n+ pushOperation(keyStringID);\n+ }\n+ }\n+\n+ function recordReorder(\n+ internalInstance: InternalInstance,\n+ id: number,\n+ nextChildren: Array<InternalInstance>\n+ ) {\n+ pushOperation(TREE_OPERATION_REORDER_CHILDREN);\n+ pushOperation(id);\n+ const nextChildIDs = nextChildren.map(getID);\n+ pushOperation(nextChildIDs.length);\n+ for (let i = 0; i < nextChildIDs.length; i++) {\n+ pushOperation(nextChildIDs[i]);\n+ }\n+ }\n+\n+ function recordUnmount(internalInstance: InternalInstance, id: number) {\n+ pendingUnmountedIDs.push(id);\n+ idToInternalInstanceMap.delete(id);\n+ }\n+\n+ function crawlAndRecordInitialMounts(id: number, parentID: number) {\n+ const internalInstance = idToInternalInstanceMap.get(id);\n+\n+ if (__DEBUG__) {\n+ console.group('crawlAndRecordInitialMounts() id:', id);\n+ }\n+\n+ recordMount(internalInstance, id, parentID);\n+ getChildren(internalInstance).forEach(child =>\n+ crawlAndRecordInitialMounts(getID(child), id)\n+ );\n+\n+ if (__DEBUG__) {\n+ console.groupEnd();\n+ }\n+ }\n+\n+ function flushInitialOperations() {\n+ \/\/ Crawl roots though and register any nodes that mounted before we were injected.\n+\n+ const roots =\n+ renderer.Mount._instancesByReactRootID ||\n+ renderer.Mount._instancesByContainerID;\n+\n+ for (let key in roots) {\n+ const internalInstance = roots[key];\n+ const id = getID(internalInstance);\n+ crawlAndRecordInitialMounts(id, 0);\n+ flushPendingEvents(id);\n+ }\n+ }\n+\n+ let pendingOperations: Array<number> = [];\n+ let pendingStringTable: Map<string, number> = new Map();\n+ let pendingUnmountedIDs: Array<number> = [];\n+ let pendingStringTableLength: number = 0;\n+ let pendingUnmountedRootID: number | null = null;\n+\n+ function flushPendingEvents(rootID: number) {\n+ if (\n+ pendingOperations.length === 0 &&\n+ pendingUnmountedIDs.length === 0 &&\n+ pendingUnmountedRootID === null\n+ ) {\n+ return;\n+ }\n+\n+ const numUnmountIDs =\n+ pendingUnmountedIDs.length + (pendingUnmountedRootID === null ? 0 : 1);\n+\n+ const operations = new Uint32Array(\n+ \/\/ Identify which renderer this update is coming from.\n+ 2 + \/\/ [rendererID, rootFiberID]\n+ \/\/ How big is the string table?\n+ 1 + \/\/ [stringTableLength]\n+ \/\/ Then goes the actual string table.\n+ pendingStringTableLength +\n+ \/\/ All unmounts are batched in a single message.\n+ \/\/ [TREE_OPERATION_REMOVE, removedIDLength, ...ids]\n+ (numUnmountIDs > 0 ? 2 + numUnmountIDs : 0) +\n+ \/\/ Mount operations\n+ pendingOperations.length\n+ );\n+\n+ \/\/ Identify which renderer this update is coming from.\n+ \/\/ This enables roots to be mapped to renderers,\n+ \/\/ Which in turn enables fiber properations, states, and hooks to be inspected.\n+ let i = 0;\n+ operations[i++] = rendererID;\n+ operations[i++] = rootID;\n+\n+ \/\/ Now fill in the string table.\n+ \/\/ [stringTableLength, str1Length, ...str1, str2Length, ...str2, ...]\n+ operations[i++] = pendingStringTableLength;\n+ pendingStringTable.forEach((value, key) => {\n+ operations[i++] = key.length;\n+ operations.set(utfEncodeString(key), i);\n+ i += key.length;\n+ });\n+\n+ if (numUnmountIDs > 0) {\n+ \/\/ All unmounts except roots are batched in a single message.\n+ operations[i++] = TREE_OPERATION_REMOVE;\n+ \/\/ The first number is how many unmounted IDs we're gonna send.\n+ operations[i++] = numUnmountIDs;\n+ \/\/ Fill in the unmounts\n+ for (let j = 0; j < pendingUnmountedIDs.length; j++) {\n+ operations[i++] = pendingUnmountedIDs[j];\n+ }\n+ \/\/ The root ID should always be unmounted last.\n+ if (pendingUnmountedRootID !== null) {\n+ operations[i] = pendingUnmountedRootID;\n+ i++;\n+ }\n+ }\n+\n+ \/\/ Fill in the rest of the operations.\n+ operations.set(pendingOperations, i);\n+ i += pendingOperations.length;\n+\n+ if (__DEBUG__) {\n+ printOperationsArray(operations);\n+ }\n+\n+ \/\/ If we've already connected to the frontend, just pass the operations through.\n+ hook.emit('operations', operations);\n+\n+ pendingOperations.length = 0;\n+ pendingUnmountedIDs = [];\n+ pendingUnmountedRootID = null;\n+ pendingStringTable.clear();\n+ pendingStringTableLength = 0;\n+ }\n+\n+ function pushOperation(op: number): void {\n+ if (__DEV__) {\n+ if (!Number.isInteger(op)) {\n+ console.error(\n+ 'pushOperation() was called but the value is not an integer.',\n+ op\n+ );\n+ }\n+ }\n+ pendingOperations.push(op);\n+ }\n+\n+ function getStringID(str: string | null): number {\n+ if (str === null) {\n+ return 0;\n+ }\n+ const existingID = pendingStringTable.get(str);\n+ if (existingID !== undefined) {\n+ return existingID;\n+ }\n+ const stringID = pendingStringTable.size + 1;\n+ pendingStringTable.set(str, stringID);\n+ \/\/ The string table total length needs to account\n+ \/\/ both for the string length, and for the array item\n+ \/\/ that contains the length itself. Hence + 1.\n+ pendingStringTableLength += str.length + 1;\n+ return stringID;\n+ }\n+\n+ function inspectElement(id: number): InspectedElement | null {\n+ let result = inspectElementRaw(id);\n+ if (result === null) {\n+ return null;\n+ }\n+ \/\/ TODO Review sanitization approach for the below inspectable values.\n+ result.context = cleanForBridge(result.context);\n+ result.props = cleanForBridge(result.props);\n+ result.state = cleanForBridge(result.state);\n+ return result;\n+ }\n+\n+ function inspectElementRaw(id: number): InspectedElement | null {\n+ const internalInstance = idToInternalInstanceMap.get(id);\n+ const data = getData(internalInstance);\n+\n+ let context = null;\n+ let owners = null;\n+ let props = null;\n+ let state = null;\n+ let source = null;\n+\n+ if (internalInstance != null) {\n+ const element = internalInstance._currentElement;\n+ if (element !== null) {\n+ props = element.props;\n+ source = element._source != null ? element._source : null;\n+\n+ let owner = element._owner;\n+ if (owner) {\n+ owners = [];\n+ while (owner != null) {\n+ const ownerData = getData(owner);\n+ owners.push({\n+ displayName: ownerData.displayName || 'Unknown',\n+ id: getID(owner),\n+ type: ownerData.type,\n+ });\n+ owner = owner.owner;\n+ }\n+ }\n+ }\n+ context = internalInstance.context || null;\n+ state = internalInstance.state || null;\n+ }\n+\n+ return {\n+ id,\n+\n+ \/\/ Hooks did not exist in legacy versions\n+ canEditHooks: false,\n+\n+ \/\/ Does the current renderer support editable function props?\n+ canEditFunctionProps: true,\n+\n+ \/\/ Suspense did not exist in legacy versions\n+ canToggleSuspense: false,\n+\n+ \/\/ Can view component source location.\n+ canViewSource:\n+ data.type === ElementTypeClass || data.type === ElementTypeFunction,\n+\n+ displayName: data.displayName,\n+\n+ type: data.type,\n+\n+ \/\/ New events system did not exist in legacy versions\n+ events: null,\n+\n+ \/\/ Inspectable properties.\n+ context,\n+ hooks: null,\n+ props,\n+ state,\n+\n+ \/\/ List of owners\n+ owners,\n+\n+ \/\/ Location of component in source coude.\n+ source,\n+ };\n+ }\n+\n+ function logElementToConsole(id: number): void {\n+ const result = inspectElementRaw(id);\n+ if (result === null) {\n+ console.warn(`Could not find element with id \"${id}\"`);\n+ return;\n+ }\n+\n+ const supportsGroup = typeof console.groupCollapsed === 'function';\n+ if (supportsGroup) {\n+ console.groupCollapsed(\n+ `[Click to expand] %c<${result.displayName || 'Component'} \/>`,\n+ \/\/ --dom-tag-name-color is the CSS variable Chrome styles HTML elements with in the console.\n+ 'color: var(--dom-tag-name-color); font-weight: normal;'\n+ );\n+ }\n+ if (result.props !== null) {\n+ console.log('Props:', result.props);\n+ }\n+ if (result.state !== null) {\n+ console.log('State:', result.state);\n+ }\n+ if (result.context !== null) {\n+ console.log('State:', result.context);\n+ }\n+ const nativeNode = findNativeNodeForInternalID(id);\n+ if (nativeNode !== null) {\n+ console.log('Node:', nativeNode);\n+ }\n+ if (window.chrome || \/firefox\/i.test(navigator.userAgent)) {\n+ console.log(\n+ 'Right-click any value to save it as a global variable for further inspection.'\n+ );\n+ }\n+ if (supportsGroup) {\n+ console.groupEnd();\n+ }\n+ }\n+\n+ function prepareViewElementSource(id: number): void {\n+ const internalInstance = idToInternalInstanceMap.get(id);\n+ if (internalInstance == null) {\n+ console.warn(`Could not find instance with id \"${id}\"`);\n+ return;\n+ }\n+\n+ const element = internalInstance._currentElement;\n+ if (element == null) {\n+ console.warn(`Could not find element with id \"${id}\"`);\n+ return;\n+ }\n+\n+ global.$type = element.type;\n+ }\n+\n+ function selectElement(id: number): void {\n+ const internalInstance = idToInternalInstanceMap.get(id);\n+ if (internalInstance == null) {\n+ console.warn(`Could not find instance with id \"${id}\"`);\n+ return;\n+ }\n+\n+ switch (getElementType(internalInstance)) {\n+ case ElementTypeClass:\n+ case ElementTypeFunction:\n+ const element = internalInstance._currentElement;\n+ if (element == null) {\n+ console.warn(`Could not find element with id \"${id}\"`);\n+ return;\n+ }\n+\n+ global.$r = {\n+ props: element.props,\n+ type: element.type,\n+ };\n+ break;\n+ default:\n+ break;\n+ }\n+ }\n+\n+ function setInProps(id: number, path: Array<string | number>, value: any) {\n+ const internalInstance = idToInternalInstanceMap.get(id);\n+ if (internalInstance != null) {\n+ const element = internalInstance._currentElement;\n+ internalInstance._currentElement = {\n+ ...element,\n+ props: copyWithSet(element.props, path, value),\n+ };\n+ forceUpdate(internalInstance._instance);\n+ }\n+ }\n+\n+ function setInState(id: number, path: Array<string | number>, value: any) {\n+ const internalInstance = idToInternalInstanceMap.get(id);\n+ if (internalInstance != null) {\n+ setIn(internalInstance.state, path, value);\n+ internalInstance.forceUpdate();\n+ }\n+ }\n+\n+ function setInContext(id: number, path: Array<string | number>, value: any) {\n+ const internalInstance = idToInternalInstanceMap.get(id);\n+ if (internalInstance != null) {\n+ setIn(internalInstance.context, path, value);\n+ forceUpdate(internalInstance);\n+ }\n+ }\n+\n+ function setIn(obj: Object, path: Array<string | number>, value: any) {\n+ const last = path.pop();\n+ const parent = path.reduce(\n+ \/\/ $FlowFixMe\n+ (reduced, attr) => (reduced ? reduced[attr] : null),\n+ obj\n+ );\n+ if (parent) {\n+ \/\/ $FlowFixMe\n+ parent[last] = value;\n+ }\n+ }\n+\n+ \/\/ v16+ only features\n+ const getProfilingData = () => {\n+ throw new Error('getProfilingData not supported by this renderer');\n+ };\n+ const handleCommitFiberRoot = () => {\n+ throw new Error('handleCommitFiberRoot not supported by this renderer');\n+ };\n+ const handleCommitFiberUnmount = () => {\n+ throw new Error('handleCommitFiberUnmount not supported by this renderer');\n+ };\n+ const overrideSuspense = () => {\n+ throw new Error('overrideSuspense not supported by this renderer');\n+ };\n+ const setInHook = () => {\n+ throw new Error('setInHook not supported by this renderer');\n+ };\n+ const startProfiling = () => {\n+ throw new Error('startProfiling not supported by this renderer');\n+ };\n+ const stopProfiling = () => {\n+ throw new Error('stopProfiling not supported by this renderer');\n+ };\n+\n+ function getBestMatchForTrackedPath(): PathMatch | null {\n+ \/\/ Not implemented.\n+ return null;\n+ }\n+\n+ function getPathForElement(id: number): Array<PathFrame> | null {\n+ \/\/ Not implemented.\n+ return null;\n+ }\n+\n+ function updateComponentFilters(componentFilters: Array<ComponentFilter>) {\n+ \/\/ Not implemented.\n+ }\n+\n+ function setTrackedPath(path: Array<PathFrame> | null) {\n+ \/\/ Not implemented.\n+ }\n+\n+ function getOwnersList(id: number): Array<Owner> | null {\n+ \/\/ Not implemented.\n+ return null;\n+ }\n+\n+ return {\n+ cleanup,\n+ flushInitialOperations,\n+ getBestMatchForTrackedPath,\n+ getFiberIDForNative: getInternalIDForNative,\n+ findNativeNodesForFiberID: (id: number) => {\n+ const nativeNode = findNativeNodeForInternalID(id);\n+ return nativeNode == null ? null : [nativeNode];\n+ },\n+ getOwnersList,\n+ getPathForElement,\n+ getProfilingData,\n+ handleCommitFiberRoot,\n+ handleCommitFiberUnmount,\n+ inspectElement,\n+ logElementToConsole,\n+ overrideSuspense,\n+ prepareViewElementSource,\n+ renderer,\n+ selectElement,\n+ setInContext,\n+ setInHook,\n+ setInProps,\n+ setInState,\n+ setTrackedPath,\n+ startProfiling,\n+ stopProfiling,\n+ updateComponentFilters,\n+ };\n+}\ndiff --git a\/src\/backend\/legacy\/utils.js b\/src\/backend\/legacy\/utils.js\nnew file mode 100644\nindex 0000000000..9fbe307935\n--- \/dev\/null\n+++ b\/src\/backend\/legacy\/utils.js\n@@ -0,0 +1,39 @@\n+\/\/ @flow\n+\n+import type { InternalInstance } from '.\/renderer';\n+\n+export function decorate(object: Object, attr: string, fn: Function): Function {\n+ const old = object[attr];\n+ object[attr] = function(instance: InternalInstance) {\n+ return fn.call(this, old, arguments);\n+ };\n+ return old;\n+}\n+\n+export function decorateMany(\n+ source: Object,\n+ fns: { [attr: string]: Function }\n+): Object {\n+ const olds = {};\n+ for (const name in fns) {\n+ olds[name] = decorate(source, name, fns[name]);\n+ }\n+ return olds;\n+}\n+\n+export function restoreMany(source: Object, olds: Object): void {\n+ for (let name in olds) {\n+ source[name] = olds[name];\n+ }\n+}\n+\n+export function forceUpdate(instance: InternalInstance): void {\n+ if (typeof instance.forceUpdate === 'function') {\n+ instance.forceUpdate();\n+ } else if (\n+ instance.updater != null &&\n+ typeof instance.updater.enqueueForceUpdate === 'function'\n+ ) {\n+ instance.updater.enqueueForceUpdate(this, () => {}, 'forceUpdate');\n+ }\n+}\ndiff --git a\/src\/backend\/types.js b\/src\/backend\/types.js\nindex d2fd74139e..af2cdd2923 100644\n--- a\/src\/backend\/types.js\n+++ b\/src\/backend\/types.js\n@@ -79,11 +79,17 @@ export type FiberData = {|\n type: ElementType,\n |};\n \n-export type NativeType = {};\n+export type NativeType = Object;\n export type RendererID = number;\n \n type Dispatcher = any;\n \n+export type GetFiberIDForNative = (\n+ component: NativeType,\n+ findNearestUnfilteredAncestor?: boolean\n+) => number | null;\n+export type FindNativeNodesForFiberID = (id: number) => ?Array<NativeType>;\n+\n export type ReactRenderer = {\n findFiberByHostInstance: (hostInstance: NativeType) => ?Fiber,\n version: string,\n@@ -208,13 +214,10 @@ export type InspectedElement = {|\n \n export type RendererInterface = {\n cleanup: () => void,\n- findNativeNodesForFiberID: (id: number) => ?Array<NativeType>,\n+ findNativeNodesForFiberID: FindNativeNodesForFiberID,\n flushInitialOperations: () => void,\n getBestMatchForTrackedPath: () => PathMatch | null,\n- getFiberIDForNative: (\n- component: NativeType,\n- findNearestUnfilteredAncestor?: boolean\n- ) => number | null,\n+ getFiberIDForNative: GetFiberIDForNative,\n getProfilingData(): ProfilingDataBackend,\n getOwnersList: (id: number) => Array<Owner> | null,\n getPathForElement: (id: number) => Array<PathFrame> | null,\ndiff --git a\/src\/utils.js b\/src\/utils.js\nindex 7c7a711f0b..85d8556cb7 100644\n--- a\/src\/utils.js\n+++ b\/src\/utils.js\n@@ -1,6 +1,13 @@\n \/\/ @flow\n \n import LRU from 'lru-cache';\n+import {\n+ TREE_OPERATION_ADD,\n+ TREE_OPERATION_REMOVE,\n+ TREE_OPERATION_REORDER_CHILDREN,\n+ TREE_OPERATION_UPDATE_TREE_BASE_DURATION,\n+} from '.\/constants';\n+import { ElementTypeRoot } from 'src\/types';\n import { LOCAL_STORAGE_FILTER_PREFERENCES_KEY } from '.\/constants';\n import { ComponentFilterElementType, ElementTypeHostComponent } from '.\/types';\n import {\n@@ -71,6 +78,99 @@ function toCodePoint(string: string) {\n return string.codePointAt(0);\n }\n \n+export function printOperationsArray(operations: Uint32Array) {\n+ \/\/ The first two values are always rendererID and rootID\n+ const rendererID = operations[0];\n+ const rootID = operations[1];\n+\n+ const logs = [`opertions for renderer:${rendererID} and root:${rootID}`];\n+\n+ let i = 2;\n+\n+ \/\/ Reassemble the string table.\n+ const stringTable = [\n+ null, \/\/ ID = 0 corresponds to the null string.\n+ ];\n+ const stringTableSize = operations[i++];\n+ const stringTableEnd = i + stringTableSize;\n+ while (i < stringTableEnd) {\n+ const nextLength = operations[i++];\n+ const nextString = utfDecodeString(\n+ (operations.slice(i, i + nextLength): any)\n+ );\n+ stringTable.push(nextString);\n+ i += nextLength;\n+ }\n+\n+ while (i < operations.length) {\n+ const operation = operations[i];\n+\n+ switch (operation) {\n+ case TREE_OPERATION_ADD: {\n+ const id = ((operations[i + 1]: any): number);\n+ const type = ((operations[i + 2]: any): ElementType);\n+\n+ i += 3;\n+\n+ if (type === ElementTypeRoot) {\n+ logs.push(`Add new root node ${id}`);\n+\n+ i++; \/\/ supportsProfiling\n+ i++; \/\/ hasOwnerMetadata\n+ } else {\n+ const parentID = ((operations[i]: any): number);\n+ i++;\n+\n+ i++; \/\/ ownerID\n+\n+ const displayNameStringID = operations[i];\n+ const displayName = stringTable[displayNameStringID];\n+ i++;\n+\n+ i++; \/\/ key\n+\n+ logs.push(\n+ `Add node ${id} (${displayName || 'null'}) as child of ${parentID}`\n+ );\n+ }\n+ break;\n+ }\n+ case TREE_OPERATION_REMOVE: {\n+ const removeLength = ((operations[i + 1]: any): number);\n+ i += 2;\n+\n+ for (let removeIndex = 0; removeIndex < removeLength; removeIndex++) {\n+ const id = ((operations[i]: any): number);\n+ i += 1;\n+\n+ logs.push(`Remove node ${id}`);\n+ }\n+ break;\n+ }\n+ case TREE_OPERATION_REORDER_CHILDREN: {\n+ const id = ((operations[i + 1]: any): number);\n+ const numChildren = ((operations[i + 2]: any): number);\n+ i += 3;\n+ const children = operations.slice(i, i + numChildren);\n+ i += numChildren;\n+\n+ logs.push(`Re-order node ${id} children ${children.join(',')}`);\n+ break;\n+ }\n+ case TREE_OPERATION_UPDATE_TREE_BASE_DURATION:\n+ \/\/ Base duration updates are only sent while profiling is in progress.\n+ \/\/ We can ignore them at this point.\n+ \/\/ The profiler UI uses them lazily in order to generate the tree.\n+ i += 3;\n+ break;\n+ default:\n+ throw Error(`Unsupported Bridge operation ${operation}`);\n+ }\n+ }\n+\n+ console.log(logs.join('\\n '));\n+}\n+\n export function getDefaultComponentFilters(): Array<ComponentFilter> {\n return [\n {\ndiff --git a\/yarn.lock b\/yarn.lock\nindex 0f838a637f..8b7b830466 100644\n--- a\/yarn.lock\n+++ b\/yarn.lock\n@@ -3646,6 +3646,15 @@ create-hmac@^1.1.0, create-hmac@^1.1.2, create-hmac@^1.1.4:\n safe-buffer \"^5.0.1\"\n sha.js \"^2.4.8\"\n \n+create-react-class@^15.6.0:\n+ version \"15.6.3\"\n+ resolved \"https:\/\/registry.yarnpkg.com\/create-react-class\/-\/create-react-class-15.6.3.tgz#2d73237fb3f970ae6ebe011a9e66f46dbca80036\"\n+ integrity sha512-M+\/3Q6E6DLO6Yx3OwrWjwHBnvfXXYA7W+dFjt\/ZDBemHO1DDZhsalX\/NUtnTYclN6GfnBDRh4qRHjcDHmlJBJg==\n+ dependencies:\n+ fbjs \"^0.8.9\"\n+ loose-envify \"^1.3.1\"\n+ object-assign \"^4.1.1\"\n+\n cross-env@^5.2.0:\n version \"5.2.0\"\n resolved \"https:\/\/registry.yarnpkg.com\/cross-env\/-\/cross-env-5.2.0.tgz#6ecd4c015d5773e614039ee529076669b9d126f2\"\n@@ -5243,6 +5252,19 @@ fbjs@0.5.1:\n ua-parser-js \"^0.7.9\"\n whatwg-fetch \"^0.9.0\"\n \n+fbjs@^0.8.9:\n+ version \"0.8.17\"\n+ resolved \"https:\/\/registry.yarnpkg.com\/fbjs\/-\/fbjs-0.8.17.tgz#c4d598ead6949112653d6588b01a5cdcd9f90fdd\"\n+ integrity sha1-xNWY6taUkRJlPWWIsBpc3Nn5D90=\n+ dependencies:\n+ core-js \"^1.0.0\"\n+ isomorphic-fetch \"^2.1.1\"\n+ loose-envify \"^1.0.0\"\n+ object-assign \"^4.1.0\"\n+ promise \"^7.1.1\"\n+ setimmediate \"^1.0.5\"\n+ ua-parser-js \"^0.7.18\"\n+\n fd-slicer@~1.1.0:\n version \"1.1.0\"\n resolved \"https:\/\/registry.yarnpkg.com\/fd-slicer\/-\/fd-slicer-1.1.0.tgz#25c7c89cb1f9077f8891bbe61d8f390eae256f1e\"\n@@ -6162,6 +6184,17 @@ http-errors@1.6.3, http-errors@~1.6.2, http-errors@~1.6.3:\n setprototypeof \"1.1.0\"\n statuses \">= 1.4.0 < 2\"\n \n+http-errors@~1.7.2:\n+ version \"1.7.2\"\n+ resolved \"https:\/\/registry.yarnpkg.com\/http-errors\/-\/http-errors-1.7.2.tgz#4f5029cf13239f31036e5b2e55292bcfbcc85c8f\"\n+ integrity sha512-uUQBt3H\/cSIVfch6i1EuPNy\/YsRSOUBXTVfZ+yR7Zjez3qjBz6i9+i4zjNaoqcoFVI4lQJ5plg63TvGfRSDCRg==\n+ dependencies:\n+ depd \"~1.1.2\"\n+ inherits \"2.0.3\"\n+ setprototypeof \"1.1.1\"\n+ statuses \">= 1.5.0 < 2\"\n+ toidentifier \"1.0.0\"\n+\n http-parser-js@>=0.4.0:\n version \"0.5.0\"\n resolved \"https:\/\/registry.yarnpkg.com\/http-parser-js\/-\/http-parser-js-0.5.0.tgz#d65edbede84349d0dc30320815a15d39cc3cbbd8\"\n@@ -6751,7 +6784,7 @@ is-retry-allowed@^1.0.0:\n resolved \"https:\/\/registry.yarnpkg.com\/is-retry-allowed\/-\/is-retry-allowed-1.1.0.tgz#11a060568b67339444033d0125a61a20d564fb34\"\n integrity sha1-EaBgVotnM5REAz0BJaYaINVk+zQ=\n \n-is-stream@^1.0.0, is-stream@^1.1.0:\n+is-stream@^1.0.0, is-stream@^1.0.1, is-stream@^1.1.0:\n version \"1.1.0\"\n resolved \"https:\/\/registry.yarnpkg.com\/is-stream\/-\/is-stream-1.1.0.tgz#12d4a3dd4e68e0b79ceb8dbc84173ae80d91ca44\"\n integrity sha1-EtSj3U5o4Lec6428hBc66A2RykQ=\n@@ -6826,6 +6859,14 @@ isobject@^3.0.0, isobject@^3.0.1:\n resolved \"https:\/\/registry.yarnpkg.com\/isobject\/-\/isobject-3.0.1.tgz#4e431e92b11a9731636aa1f9c8d1ccbcfdab78df\"\n integrity sha1-TkMekrEalzFjaqH5yNHMvP2reN8=\n \n+isomorphic-fetch@^2.1.1:\n+ version \"2.2.1\"\n+ resolved \"https:\/\/registry.yarnpkg.com\/isomorphic-fetch\/-\/isomorphic-fetch-2.2.1.tgz#611ae1acf14f5e81f729507472819fe9733558a9\"\n+ integrity sha1-YRrhrPFPXoH3KVB0coGf6XM1WKk=\n+ dependencies:\n+ node-fetch \"^1.0.1\"\n+ whatwg-fetch \">=0.10.0\"\n+\n isstream@~0.1.2:\n version \"0.1.2\"\n resolved \"https:\/\/registry.yarnpkg.com\/isstream\/-\/isstream-0.1.2.tgz#47e63f7af55afa6f92e1500e690eb8b8529c099a\"\n@@ -7989,7 +8030,7 @@ loglevel@^1.6.1:\n resolved \"https:\/\/registry.yarnpkg.com\/loglevel\/-\/loglevel-1.6.1.tgz#e0fc95133b6ef276cdc8887cdaf24aa6f156f8fa\"\n integrity sha1-4PyVEztu8nbNyIh82vJKpvFW+Po=\n \n-loose-envify@^1.0.0, loose-envify@^1.1.0, loose-envify@^1.4.0:\n+loose-envify@^1.0.0, loose-envify@^1.1.0, loose-envify@^1.3.1, loose-envify@^1.4.0:\n version \"1.4.0\"\n resolved \"https:\/\/registry.yarnpkg.com\/loose-envify\/-\/loose-envify-1.4.0.tgz#71ee51fa7be4caec1a63839f7e682d8132d30caf\"\n integrity sha512-lyuxPGr\/Wfhrlem2CL\/UcnUc1zcqKAImBDzukY7Y5F\/yQiNdko6+fRLevlw1HgMySw7f611UIY408EtxRSoK3Q==\n@@ -8262,6 +8303,11 @@ mime@1.4.1:\n resolved \"https:\/\/registry.yarnpkg.com\/mime\/-\/mime-1.4.1.tgz#121f9ebc49e3766f311a76e1fa1c8003c4b03aa6\"\n integrity sha512-KI1+qOZu5DcW6wayYHSzR\/tXKCDC5Om4s1z2QJjDULzLcmf3DvzS7oluY4HCTrc+9FiKmWUgeNLg7W3uIQvxtQ==\n \n+mime@1.6.0:\n+ version \"1.6.0\"\n+ resolved \"https:\/\/registry.yarnpkg.com\/mime\/-\/mime-1.6.0.tgz#32cd9e5c64553bd58d19a568af452acff04981b1\"\n+ integrity sha512-x0Vn8spI+wuJ1O6S7gnbaQg8Pxh4NNHb7KSINmEWKiPE4RKOplvijn+NkmYmmRgP68mc70j2EbeTFRsrswaQeg==\n+\n mime@^2.3.1:\n version \"2.4.2\"\n resolved \"https:\/\/registry.yarnpkg.com\/mime\/-\/mime-2.4.2.tgz#ce5229a5e99ffc313abac806b482c10e7ba6ac78\"\n@@ -8395,7 +8441,7 @@ ms@2.0.0:\n resolved \"https:\/\/registry.yarnpkg.com\/ms\/-\/ms-2.0.0.tgz#5608aeadfc00be6c2901df5f9861788de0d597c8\"\n integrity sha1-VgiurfwAvmwpAd9fmGF4jeDVl8g=\n \n-ms@^2.1.1:\n+ms@2.1.1, ms@^2.1.1:\n version \"2.1.1\"\n resolved \"https:\/\/registry.yarnpkg.com\/ms\/-\/ms-2.1.1.tgz#30a5864eb3ebb0a66f2ebe6d727af06a09d86e0a\"\n integrity sha512-tgp+dl5cGk28utYktBsrFqA7HKgrhgPsg6Z\/EfhWI4gl1Hwq8B\/GmY\/0oXZ6nF8hDVesS\/FpnYaD\/kOWhYQvyg==\n@@ -8536,6 +8582,14 @@ nice-try@^1.0.4:\n resolved \"https:\/\/registry.yarnpkg.com\/nice-try\/-\/nice-try-1.0.5.tgz#a3378a7696ce7d223e88fc9b764bd7ef1089e366\"\n integrity sha512-1nh45deeb5olNY7eX82BkPO7SSxR5SSYJiPTrTdFUVYwAl8CKMA5N9PjTYkHiRjisVcxcQ1HXdLhx2qxxJzLNQ==\n \n+node-fetch@^1.0.1:\n+ version \"1.7.3\"\n+ resolved \"https:\/\/registry.yarnpkg.com\/node-fetch\/-\/node-fetch-1.7.3.tgz#980f6f72d85211a5347c6b2bc18c5b84c3eb47ef\"\n+ integrity sha512-NhZ4CsKx7cYm2vSrBAr2PvFOe6sWDf0UYLRqA6svUYg7+\/TSfVAu49jYC4BvQ4Sms9SZgdqGBgroqfDhJdTyKQ==\n+ dependencies:\n+ encoding \"^0.1.11\"\n+ is-stream \"^1.0.1\"\n+\n node-forge@0.7.5:\n version \"0.7.5\"\n resolved \"https:\/\/registry.yarnpkg.com\/node-forge\/-\/node-forge-0.7.5.tgz#6c152c345ce11c52f465c2abd957e8639cd674df\"\n@@ -9155,7 +9209,7 @@ parse5@^3.0.1:\n dependencies:\n \"@types\/node\" \"*\"\n \n-parseurl@~1.3.2:\n+parseurl@~1.3.2, parseurl@~1.3.3:\n version \"1.3.3\"\n resolved \"https:\/\/registry.yarnpkg.com\/parseurl\/-\/parseurl-1.3.3.tgz#9da19e7bee8d12dff0513ed5b76957793bc2e8d4\"\n integrity sha512-CiyeOxFT\/JZyN5m0z9PfXw4SCBJ6Sygz1Dpl0wqjlhDEGGBP1GnsUVEL0p63hoG1fcj3fHynXi9NYO4nWOL+qQ==\n@@ -9517,6 +9571,13 @@ promise@^7.0.3:\n dependencies:\n asap \"~2.0.3\"\n \n+promise@^7.1.1:\n+ version \"7.3.1\"\n+ resolved \"https:\/\/registry.yarnpkg.com\/promise\/-\/promise-7.3.1.tgz#064b72602b18f90f29192b8b1bc418ffd1ebd3bf\"\n+ integrity sha512-nolQXZ\/4L+bP\/UGlkfaIujX9BKxGwmQ9OT4mOt5yvy8iK1h3wqTEJCijzGANTCCl9nWjY41juyAn2K3Q1hLLTg==\n+ dependencies:\n+ asap \"~2.0.3\"\n+\n prompts@^2.0.1:\n version \"2.0.4\"\n resolved \"https:\/\/registry.yarnpkg.com\/prompts\/-\/prompts-2.0.4.tgz#179f9d4db3128b9933aa35f93a800d8fce76a682\"\n@@ -9683,6 +9744,11 @@ range-parser@^1.0.3, range-parser@~1.2.0:\n resolved \"https:\/\/registry.yarnpkg.com\/range-parser\/-\/range-parser-1.2.0.tgz#f49be6b487894ddc40dcc94a322f611092e00d5e\"\n integrity sha1-9JvmtIeJTdxA3MlKMi9hEJLgDV4=\n \n+range-parser@~1.2.1:\n+ version \"1.2.1\"\n+ resolved \"https:\/\/registry.yarnpkg.com\/range-parser\/-\/range-parser-1.2.1.tgz#3cf37023d199e1c24d1a55b84800c2f3e6468031\"\n+ integrity sha512-Hrgsx+orqoygnmhFbKaHE6c296J+HTAQXoxEF6gNupROmmGJRoyzfG3ccAveqCBrwr\/2yxQ5BVd\/GTl5agOwSg==\n+\n raw-body@2.3.3:\n version \"2.3.3\"\n resolved \"https:\/\/registry.yarnpkg.com\/raw-body\/-\/raw-body-2.3.3.tgz#1b324ece6b5706e153855bc1148c65bb7f6ea0c3\"\n@@ -9703,6 +9769,17 @@ rc@^1.0.1, rc@^1.1.6, rc@^1.2.7:\n minimist \"^1.2.0\"\n strip-json-comments \"~2.0.1\"\n \n+\"react-15@npm:react@^15\":\n+ version \"15.6.2\"\n+ resolved \"https:\/\/registry.yarnpkg.com\/react\/-\/react-15.6.2.tgz#dba0434ab439cfe82f108f0f511663908179aa72\"\n+ integrity sha1-26BDSrQ5z+gvEI8PURZjkIF5qnI=\n+ dependencies:\n+ create-react-class \"^15.6.0\"\n+ fbjs \"^0.8.9\"\n+ loose-envify \"^1.1.0\"\n+ object-assign \"^4.1.0\"\n+ prop-types \"^15.5.10\"\n+\n react-color@^2.11.7:\n version \"2.17.0\"\n resolved \"https:\/\/registry.yarnpkg.com\/react-color\/-\/react-color-2.17.0.tgz#e14b8a11f4e89163f65a34c8b43faf93f7f02aaa\"\n@@ -9715,6 +9792,16 @@ react-color@^2.11.7:\n reactcss \"^1.2.0\"\n tinycolor2 \"^1.4.1\"\n \n+\"react-dom-15@npm:react-dom@^15\":\n+ version \"15.6.2\"\n+ resolved \"https:\/\/registry.yarnpkg.com\/react-dom\/-\/react-dom-15.6.2.tgz#41cfadf693b757faf2708443a1d1fd5a02bef730\"\n+ integrity sha1-Qc+t9pO3V\/rycIRDodH9WgK+9zA=\n+ dependencies:\n+ fbjs \"^0.8.9\"\n+ loose-envify \"^1.1.0\"\n+ object-assign \"^4.1.0\"\n+ prop-types \"^15.5.10\"\n+\n react-dom@^0.0.0-50b50c26f:\n version \"0.0.0-50b50c26f\"\n resolved \"https:\/\/registry.yarnpkg.com\/react-dom\/-\/react-dom-0.0.0-50b50c26f.tgz#3cd8da0f2276ed4b7a926e1807d2675b2eb40227\"\n@@ -10497,6 +10584,25 @@ send@0.16.2:\n range-parser \"~1.2.0\"\n statuses \"~1.4.0\"\n \n+send@0.17.1:\n+ version \"0.17.1\"\n+ resolved \"https:\/\/registry.yarnpkg.com\/send\/-\/send-0.17.1.tgz#c1d8b059f7900f7466dd4938bdc44e11ddb376c8\"\n+ integrity sha512-BsVKsiGcQMFwT8UxypobUKyv7irCNRHk1T0G680vk88yf6LBByGcZJOTJCrTP2xVN6yI+XjPJcNuE3V4fT9sAg==\n+ dependencies:\n+ debug \"2.6.9\"\n+ depd \"~1.1.2\"\n+ destroy \"~1.0.4\"\n+ encodeurl \"~1.0.2\"\n+ escape-html \"~1.0.3\"\n+ etag \"~1.8.1\"\n+ fresh \"0.5.2\"\n+ http-errors \"~1.7.2\"\n+ mime \"1.6.0\"\n+ ms \"2.1.1\"\n+ on-finished \"~2.3.0\"\n+ range-parser \"~1.2.1\"\n+ statuses \"~1.5.0\"\n+\n serialize-javascript@^1.4.0:\n version \"1.6.1\"\n resolved \"https:\/\/registry.yarnpkg.com\/serialize-javascript\/-\/serialize-javascript-1.6.1.tgz#4d1f697ec49429a847ca6f442a2a755126c4d879\"\n@@ -10525,6 +10631,16 @@ serve-static@1.13.2:\n parseurl \"~1.3.2\"\n send \"0.16.2\"\n \n+serve-static@^1.14.1:\n+ version \"1.14.1\"\n+ resolved \"https:\/\/registry.yarnpkg.com\/serve-static\/-\/serve-static-1.14.1.tgz#666e636dc4f010f7ef29970a88a674320898b2f9\"\n+ integrity sha512-JMrvUwE54emCYWlTI+hGrGv5I8dEwmco\/00EvkzIIsR7MqrHonbD9pO2MOfFnpFntl7ecpZs+3mW+XbQZu9QCg==\n+ dependencies:\n+ encodeurl \"~1.0.2\"\n+ escape-html \"~1.0.3\"\n+ parseurl \"~1.3.3\"\n+ send \"0.17.1\"\n+\n set-blocking@^2.0.0, set-blocking@~2.0.0:\n version \"2.0.0\"\n resolved \"https:\/\/registry.yarnpkg.com\/set-blocking\/-\/set-blocking-2.0.0.tgz#045f9782d011ae9a6803ddd382b24392b3d890f7\"\n@@ -10550,7 +10666,7 @@ set-value@^2.0.0:\n is-plain-object \"^2.0.3\"\n split-string \"^3.0.1\"\n \n-setimmediate@^1.0.4:\n+setimmediate@^1.0.4, setimmediate@^1.0.5:\n version \"1.0.5\"\n resolved \"https:\/\/registry.yarnpkg.com\/setimmediate\/-\/setimmediate-1.0.5.tgz#290cbb232e306942d7d7ea9b83732ab7856f8285\"\n integrity sha1-KQy7Iy4waULX1+qbg3Mqt4VvgoU=\n@@ -10560,6 +10676,11 @@ setprototypeof@1.1.0:\n resolved \"https:\/\/registry.yarnpkg.com\/setprototypeof\/-\/setprototypeof-1.1.0.tgz#d0bd85536887b6fe7c0d818cb962d9d91c54e656\"\n integrity sha512-BvE\/TwpZX4FXExxOxZyRGQQv651MSwmWKZGqvmPcRIjDqWub67kTKuIMx43cZZrS\/cBBzwBcNDWoFxt2XEFIpQ==\n \n+setprototypeof@1.1.1:\n+ version \"1.1.1\"\n+ resolved \"https:\/\/registry.yarnpkg.com\/setprototypeof\/-\/setprototypeof-1.1.1.tgz#7e95acb24aa92f5885e0abef5ba131330d4ae683\"\n+ integrity sha512-JvdAWfbXeIGaZ9cILp38HntZSFSo3mWg6xGcJJsd+d4aRMOqauag1C63dJfDw7OaMYwEbHMOxEZ1lqVRYP2OAw==\n+\n sha.js@2.2.6:\n version \"2.2.6\"\n resolved \"https:\/\/registry.yarnpkg.com\/sha.js\/-\/sha.js-2.2.6.tgz#17ddeddc5f722fb66501658895461977867315ba\"\n@@ -10962,7 +11083,7 @@ static-extend@^0.1.1:\n define-property \"^0.2.5\"\n object-copy \"^0.1.0\"\n \n-\"statuses@>= 1.4.0 < 2\":\n+\"statuses@>= 1.4.0 < 2\", \"statuses@>= 1.5.0 < 2\", statuses@~1.5.0:\n version \"1.5.0\"\n resolved \"https:\/\/registry.yarnpkg.com\/statuses\/-\/statuses-1.5.0.tgz#161c7dac177659fd9811f43771fa99381478628c\"\n integrity sha1-Fhx9rBd2Wf2YEfQ3cfqZOBR4Yow=\n@@ -11512,6 +11633,11 @@ to-regex@^3.0.1, to-regex@^3.0.2:\n regex-not \"^1.0.2\"\n safe-regex \"^1.1.0\"\n \n+toidentifier@1.0.0:\n+ version \"1.0.0\"\n+ resolved \"https:\/\/registry.yarnpkg.com\/toidentifier\/-\/toidentifier-1.0.0.tgz#7e1be3470f1e77948bc43d94a3c8f4d7752ba553\"\n+ integrity sha512-yaOH\/Pk\/VEhBWWTlhI+qXxDFXlejDGcQipMlyxda9nthulaxLZUNcUqFxokp0vcYnvteJln5FNQDRrxj3YcbVw==\n+\n tosource@1.0.0:\n version \"1.0.0\"\n resolved \"https:\/\/registry.yarnpkg.com\/tosource\/-\/tosource-1.0.0.tgz#42d88dd116618bcf00d6106dd5446f3427902ff1\"\n@@ -11613,7 +11739,7 @@ typedarray@^0.0.6:\n resolved \"https:\/\/registry.yarnpkg.com\/typedarray\/-\/typedarray-0.0.6.tgz#867ac74e3864187b1d3d47d996a78ec5c8830777\"\n integrity sha1-hnrHTjhkGHsdPUfZlqeOxciDB3c=\n \n-ua-parser-js@^0.7.9:\n+ua-parser-js@^0.7.18, ua-parser-js@^0.7.9:\n version \"0.7.19\"\n resolved \"https:\/\/registry.yarnpkg.com\/ua-parser-js\/-\/ua-parser-js-0.7.19.tgz#94151be4c0a7fb1d001af7022fdaca4642659e4b\"\n integrity sha512-T3PVJ6uz8i0HzPxOF9SWzWAlfN\/DavlpQqepn22xgve\/5QecC+XMCAtmUNnY7C9StehaV6exjUCI801lOI7QlQ==\n@@ -12113,6 +12239,11 @@ whatwg-encoding@^1.0.1, whatwg-encoding@^1.0.3:\n dependencies:\n iconv-lite \"0.4.19\"\n \n+whatwg-fetch@>=0.10.0:\n+ version \"3.0.0\"\n+ resolved \"https:\/\/registry.yarnpkg.com\/whatwg-fetch\/-\/whatwg-fetch-3.0.0.tgz#fc804e458cc460009b1a2b966bc8817d2578aefb\"\n+ integrity sha512-9GSJUgz1D4MfyKU7KRqwOjXCXTqWdFNvEr7eUBYchQiVc744mqK\/MzXPNR2WsPkmkOa4ywfg8C2n8h+13Bey1Q==\n+\n whatwg-fetch@^0.9.0:\n version \"0.9.0\"\n resolved \"https:\/\/registry.yarnpkg.com\/whatwg-fetch\/-\/whatwg-fetch-0.9.0.tgz#0e3684c6cb9995b43efc9df03e4c365d95fd9cc0\"\n","commit":{"shortRevision":"37c331533d","revision":"37c331533d9c8b2136d1b5953d80cb0da230769a","authorEmail":"brian.david.vaughn@gmail.com","authoredAt":"2019-06-09T16:24:00-07:00","authorName":"Brian Vaughn","subject":"Merge pull request #173 from bvaughn\/legacy"},"files":[{"status":"M","path":".eslintignore"},{"status":"M","path":".gitignore"},{"status":"A","path":"fixtures\/regression\/14.9.html"},{"status":"A","path":"fixtures\/regression\/15.0.html"},{"status":"A","path":"fixtures\/regression\/15.1.html"},{"status":"A","path":"fixtures\/regression\/15.2.html"},{"status":"A","path":"fixtures\/regression\/15.3.html"},{"status":"A","path":"fixtures\/regression\/15.4.html"},{"status":"A","path":"fixtures\/regression\/15.5.html"},{"status":"A","path":"fixtures\/regression\/15.6.html"},{"status":"A","path":"fixtures\/regression\/16.0.html"},{"status":"A","path":"fixtures\/regression\/16.1.html"},{"status":"A","path":"fixtures\/regression\/16.2.html"},{"status":"A","path":"fixtures\/regression\/16.3.html"},{"status":"A","path":"fixtures\/regression\/16.4.html"},{"status":"A","path":"fixtures\/regression\/16.5.html"},{"status":"A","path":"fixtures\/regression\/16.6.html"},{"status":"A","path":"fixtures\/regression\/16.7.html"},{"status":"A","path":"fixtures\/regression\/canary.html"},{"status":"A","path":"fixtures\/regression\/index.html"},{"status":"A","path":"fixtures\/regression\/next.html"},{"status":"A","path":"fixtures\/regression\/server.js"},{"status":"A","path":"fixtures\/regression\/shared.js"},{"status":"A","path":"fixtures\/regression\/styles.css"},{"status":"M","path":"flow-typed\/jest.js"},{"status":"M","path":"package.json"},{"status":"A","path":"src\/__tests__\/legacy\/__snapshots__\/storeLegacy-v15-test.js.snap"},{"status":"A","path":"src\/__tests__\/legacy\/storeLegacy-v15-test.js"},{"status":"M","path":"src\/__tests__\/utils.js"},{"status":"M","path":"src\/backend\/index.js"},{"status":"A","path":"src\/backend\/legacy\/getData.js"},{"status":"A","path":"src\/backend\/legacy\/renderer.js"},{"status":"A","path":"src\/backend\/legacy\/utils.js"},{"status":"M","path":"src\/backend\/types.js"},{"status":"M","path":"src\/utils.js"},{"status":"M","path":"yarn.lock"}],"parents":["ea03ddd583baad7790f36959fb4abe308e85ac24","e66fcaf17d48adbda479251c86ede7cf1e253fdf"]}</article></body></html>

dillon1000/react

Files changed