diff -Nru firefox-trunk-63.0~a1~hg20180706r425287/browser/app/winlauncher/DllBlocklistWin.cpp firefox-trunk-63.0~a1~hg20180709r425475/browser/app/winlauncher/DllBlocklistWin.cpp --- firefox-trunk-63.0~a1~hg20180706r425287/browser/app/winlauncher/DllBlocklistWin.cpp 2018-07-06 10:54:48.000000000 +0000 +++ firefox-trunk-63.0~a1~hg20180709r425475/browser/app/winlauncher/DllBlocklistWin.cpp 2018-07-09 12:32:49.000000000 +0000 @@ -357,21 +357,13 @@ { mozilla::CrossProcessDllInterceptor intcpt(aChildProcess); intcpt.Init(L"ntdll.dll"); - bool ok = stub_NtMapViewOfSection.SetDetour(intcpt, "NtMapViewOfSection", + bool ok = stub_NtMapViewOfSection.SetDetour(aChildProcess, intcpt, + "NtMapViewOfSection", &patched_NtMapViewOfSection); if (!ok) { return false; } - // Set the child process's copy of stub_NtMapViewOfSection - SIZE_T bytesWritten; - ok = !!::WriteProcessMemory(aChildProcess, &stub_NtMapViewOfSection, - &stub_NtMapViewOfSection, - sizeof(stub_NtMapViewOfSection), &bytesWritten); - if (!ok) { - return false; - } - // Because aChildProcess has just been created in a suspended state, its // dynamic linker has not yet been initialized, thus its executable has // not yet been linked with ntdll.dll. If the blocklist hook intercepts a @@ -407,6 +399,8 @@ ptrdiff_t iatLength = (curIatThunk - firstIatThunk) * sizeof(IMAGE_THUNK_DATA); + SIZE_T bytesWritten; + { // Scope for prot AutoVirtualProtect prot(firstIatThunk, iatLength, PAGE_READWRITE, aChildProcess); diff -Nru firefox-trunk-63.0~a1~hg20180706r425287/browser/base/content/browser.js firefox-trunk-63.0~a1~hg20180709r425475/browser/base/content/browser.js --- firefox-trunk-63.0~a1~hg20180706r425287/browser/base/content/browser.js 2018-07-06 10:54:48.000000000 +0000 +++ firefox-trunk-63.0~a1~hg20180709r425475/browser/base/content/browser.js 2018-07-09 12:32:49.000000000 +0000 @@ -4563,12 +4563,6 @@ menu.setAttribute("disabled", "true"); } } -function updateTabMenuUserContextUIVisibility(id) { - let menu = document.getElementById(id); - // Visibility of Tab menu item can change frequently. - menu.hidden = !Services.prefs.getBoolPref("privacy.userContext.enabled", false) || - PrivateBrowsingUtils.isWindowPrivate(window); -} /** * Updates the User Context UI indicators if the browser is in a non-default context @@ -4602,44 +4596,6 @@ } /** - * Fill 'Reopen in Container' menu. - */ -function createReopenInContainerMenu(event) { - let currentid = TabContextMenu.contextTab.getAttribute("usercontextid"); - - return createUserContextMenu(event, { - isContextMenu: true, - excludeUserContextId: currentid, - }); -} - -/** - * Reopen the tab in another container. - */ -function reopenInContainer(event) { - let userContextId = parseInt(event.target.getAttribute("data-usercontextid")); - let currentTab = TabContextMenu.contextTab; - let isSelected = (gBrowser.selectedTab == currentTab); - let uri = currentTab.linkedBrowser.currentURI.spec; - - let newTab = gBrowser.addTab(uri, { - userContextId, - pinned: currentTab.pinned, - index: currentTab._tPos + 1, - }); - - // Carry over some configuration. - if (isSelected) { - gBrowser.selectedTab = newTab; - } - if (currentTab.muted) { - if (!newTab.muted) { - newTab.toggleMuteAudio(currentTab.muteReason); - } - } -} - -/** * Makes the Character Encoding menu enabled or disabled as appropriate. * To be called when the View menu or the app menu is opened. */ @@ -7843,136 +7799,6 @@ }, }; -var TabContextMenu = { - contextTab: null, - _updateToggleMuteMenuItems(aTab, aConditionFn) { - ["muted", "soundplaying"].forEach(attr => { - if (!aConditionFn || aConditionFn(attr)) { - if (aTab.hasAttribute(attr)) { - aTab.toggleMuteMenuItem.setAttribute(attr, "true"); - aTab.toggleMultiSelectMuteMenuItem.setAttribute(attr, "true"); - } else { - aTab.toggleMuteMenuItem.removeAttribute(attr); - aTab.toggleMultiSelectMuteMenuItem.removeAttribute(attr); - } - } - }); - }, - updateContextMenu: function updateContextMenu(aPopupMenu) { - this.contextTab = aPopupMenu.triggerNode.localName == "tab" ? - aPopupMenu.triggerNode : gBrowser.selectedTab; - let disabled = gBrowser.tabs.length == 1; - let multiselectionContext = this.contextTab.multiselected; - - var menuItems = aPopupMenu.getElementsByAttribute("tbattr", "tabbrowser-multiple"); - for (let menuItem of menuItems) - menuItem.disabled = disabled; - - if (this.contextTab.hasAttribute("customizemode")) - document.getElementById("context_openTabInWindow").disabled = true; - - disabled = gBrowser.visibleTabs.length == 1; - menuItems = aPopupMenu.getElementsByAttribute("tbattr", "tabbrowser-multiple-visible"); - for (let menuItem of menuItems) - menuItem.disabled = disabled; - - // Session store - document.getElementById("context_undoCloseTab").disabled = - SessionStore.getClosedTabCount(window) == 0; - - // Only one of Reload_Tab/Reload_Selected_Tabs should be visible. - document.getElementById("context_reloadTab").hidden = multiselectionContext; - document.getElementById("context_reloadSelectedTabs").hidden = !multiselectionContext; - - // Only one of pin/unpin/multiselect-pin/multiselect-unpin should be visible - let contextPinTab = document.getElementById("context_pinTab"); - contextPinTab.hidden = this.contextTab.pinned || multiselectionContext; - let contextUnpinTab = document.getElementById("context_unpinTab"); - contextUnpinTab.hidden = !this.contextTab.pinned || multiselectionContext; - let contextPinSelectedTabs = document.getElementById("context_pinSelectedTabs"); - contextPinSelectedTabs.hidden = this.contextTab.pinned || !multiselectionContext; - let contextUnpinSelectedTabs = document.getElementById("context_unpinSelectedTabs"); - contextUnpinSelectedTabs.hidden = !this.contextTab.pinned || !multiselectionContext; - - // Disable "Close Tabs to the Right" if there are no tabs - // following it. - document.getElementById("context_closeTabsToTheEnd").disabled = - gBrowser.getTabsToTheEndFrom(this.contextTab).length == 0; - - // Disable "Close other Tabs" if there are no unpinned tabs. - let unpinnedTabsToClose = gBrowser.visibleTabs.length - gBrowser._numPinnedTabs; - if (!this.contextTab.pinned) { - unpinnedTabsToClose--; - } - document.getElementById("context_closeOtherTabs").disabled = unpinnedTabsToClose < 1; - - // Only one of close_tab/close_selected_tabs should be visible - document.getElementById("context_closeTab").hidden = multiselectionContext; - document.getElementById("context_closeSelectedTabs").hidden = !multiselectionContext; - - // Hide "Bookmark All Tabs" for a pinned tab. Update its state if visible. - let bookmarkAllTabs = document.getElementById("context_bookmarkAllTabs"); - bookmarkAllTabs.hidden = this.contextTab.pinned; - if (!bookmarkAllTabs.hidden) - PlacesCommandHook.updateBookmarkAllTabsCommand(); - - let toggleMute = document.getElementById("context_toggleMuteTab"); - let toggleMultiSelectMute = document.getElementById("context_toggleMuteSelectedTabs"); - - // Only one of mute_unmute_tab/mute_unmute_selected_tabs should be visible - toggleMute.hidden = multiselectionContext; - toggleMultiSelectMute.hidden = !multiselectionContext; - - // Adjust the state of the toggle mute menu item. - if (this.contextTab.hasAttribute("activemedia-blocked")) { - toggleMute.label = gNavigatorBundle.getString("playTab.label"); - toggleMute.accessKey = gNavigatorBundle.getString("playTab.accesskey"); - } else if (this.contextTab.hasAttribute("muted")) { - toggleMute.label = gNavigatorBundle.getString("unmuteTab.label"); - toggleMute.accessKey = gNavigatorBundle.getString("unmuteTab.accesskey"); - } else { - toggleMute.label = gNavigatorBundle.getString("muteTab.label"); - toggleMute.accessKey = gNavigatorBundle.getString("muteTab.accesskey"); - } - - // Adjust the state of the toggle mute menu item for multi-selected tabs. - if (this.contextTab.hasAttribute("activemedia-blocked")) { - toggleMultiSelectMute.label = gNavigatorBundle.getString("playTabs.label"); - toggleMultiSelectMute.accessKey = gNavigatorBundle.getString("playTabs.accesskey"); - } else if (this.contextTab.hasAttribute("muted")) { - toggleMultiSelectMute.label = gNavigatorBundle.getString("unmuteSelectedTabs.label"); - toggleMultiSelectMute.accessKey = gNavigatorBundle.getString("unmuteSelectedTabs.accesskey"); - } else { - toggleMultiSelectMute.label = gNavigatorBundle.getString("muteSelectedTabs.label"); - toggleMultiSelectMute.accessKey = gNavigatorBundle.getString("muteSelectedTabs.accesskey"); - } - - this.contextTab.toggleMuteMenuItem = toggleMute; - this.contextTab.toggleMultiSelectMuteMenuItem = toggleMultiSelectMute; - this._updateToggleMuteMenuItems(this.contextTab); - - this.contextTab.addEventListener("TabAttrModified", this); - aPopupMenu.addEventListener("popuphiding", this); - - gSync.updateTabContextMenu(aPopupMenu, this.contextTab); - - updateTabMenuUserContextUIVisibility("context_reopenInContainer"); - }, - handleEvent(aEvent) { - switch (aEvent.type) { - case "popuphiding": - gBrowser.removeEventListener("TabAttrModified", this); - aEvent.target.removeEventListener("popuphiding", this); - break; - case "TabAttrModified": - let tab = aEvent.target; - this._updateToggleMuteMenuItems(tab, - attr => aEvent.detail.changed.includes(attr)); - break; - } - } -}; - // Prompt user to restart the browser in safe mode function safeModeRestart() { if (Services.appinfo.inSafeMode) { diff -Nru firefox-trunk-63.0~a1~hg20180706r425287/browser/base/content/browser-siteIdentity.js firefox-trunk-63.0~a1~hg20180709r425475/browser/base/content/browser-siteIdentity.js --- firefox-trunk-63.0~a1~hg20180706r425287/browser/base/content/browser-siteIdentity.js 2018-07-06 10:54:48.000000000 +0000 +++ firefox-trunk-63.0~a1~hg20180709r425475/browser/base/content/browser-siteIdentity.js 2018-07-09 12:32:49.000000000 +0000 @@ -46,12 +46,6 @@ _state: 0, /** - * This flag gets set if the identity popup was opened by a keypress, - * to be able to focus it on the popupshown event. - */ - _popupTriggeredByKeyboard: false, - - /** * RegExp used to decide if an about url should be shown as being part of * the browser UI. */ @@ -831,7 +825,14 @@ return; } - this._popupTriggeredByKeyboard = event.type == "keypress"; + // Move focus to the next available element in the identity popup. + // This is required by role=alertdialog and fixes an issue where + // an already open panel would steal focus from the identity popup. + if (event.type == "keypress") { + let panelView = PanelView.forNode(this._identityPopupMainView); + this._identityPopupMainView.addEventListener("ViewShown", () => panelView.focusFirstNavigableElement(), + {once: true}); + } // Make sure that the display:none style we set in xul is removed now that // the popup is actually needed @@ -853,13 +854,6 @@ onPopupShown(event) { if (event.target == this._identityPopup) { - if (this._popupTriggeredByKeyboard) { - // Move focus to the next available element in the identity popup. - // This is required by role=alertdialog and fixes an issue where - // an already open panel would steal focus from the identity popup. - document.commandDispatcher.advanceFocusIntoSubtree(this._identityPopup); - } - window.addEventListener("focus", this, true); } }, diff -Nru firefox-trunk-63.0~a1~hg20180706r425287/browser/base/content/browser-window.css firefox-trunk-63.0~a1~hg20180709r425475/browser/base/content/browser-window.css --- firefox-trunk-63.0~a1~hg20180706r425287/browser/base/content/browser-window.css 2018-07-06 10:54:48.000000000 +0000 +++ firefox-trunk-63.0~a1~hg20180709r425475/browser/base/content/browser-window.css 1970-01-01 00:00:00.000000000 +0000 @@ -1,23 +0,0 @@ -/* This Source Code Form is subject to the terms of the Mozilla Public - * License, v. 2.0. If a copy of the MPL was not distributed with this - * file, You can obtain one at http://mozilla.org/MPL/2.0/. */ - -/* - * The "global.css" stylesheet is imported first to allow other stylesheets to - * override rules using selectors with the same specificity. This applies to - * both "content" and "skin" packages, which bug 1385444 will unify later. - */ -@import url("chrome://global/skin/"); - -@import url("chrome://browser/content/browser.css"); -@import url("chrome://browser/content/tabbrowser.css"); -@import url("chrome://browser/content/downloads/downloads.css"); -@import url("chrome://browser/content/places/places.css"); -@import url("chrome://browser/content/usercontext/usercontext.css"); -@import url("chrome://browser/skin/"); -@import url("chrome://browser/skin/controlcenter/panel.css"); -@import url("chrome://browser/skin/customizableui/panelUI.css"); -@import url("chrome://browser/skin/downloads/downloads.css"); -@import url("chrome://browser/skin/searchbar.css"); -@import url("chrome://browser/skin/places/places.css"); -@import url("chrome://browser/skin/places/editBookmark.css"); diff -Nru firefox-trunk-63.0~a1~hg20180706r425287/browser/base/content/browser.xul firefox-trunk-63.0~a1~hg20180709r425475/browser/base/content/browser.xul --- firefox-trunk-63.0~a1~hg20180706r425287/browser/base/content/browser.xul 2018-07-06 10:54:48.000000000 +0000 +++ firefox-trunk-63.0~a1~hg20180709r425475/browser/base/content/browser.xul 2018-07-09 12:32:49.000000000 +0000 @@ -6,7 +6,23 @@ # License, v. 2.0. If a copy of the MPL was not distributed with this # file, You can obtain one at http://mozilla.org/MPL/2.0/. - + + + + + + + + + + + + + + + # All DTD information is stored in a separate file so that it can be shared by @@ -98,8 +114,8 @@ label="&reopenInContainer.label;" accesskey="&reopenInContainer.accesskey;" hidden="true"> - + [preference]"); + let checkboxes = document.querySelectorAll("checkbox[preference]"); for (let i = 0; i < checkboxes.length; ++i) { let pref = Preferences.get(checkboxes[i].getAttribute("preference")); if (!pref.value) diff -Nru firefox-trunk-63.0~a1~hg20180706r425287/browser/base/content/sanitize.xul firefox-trunk-63.0~a1~hg20180709r425475/browser/base/content/sanitize.xul --- firefox-trunk-63.0~a1~hg20180706r425287/browser/base/content/sanitize.xul 2018-07-06 10:54:48.000000000 +0000 +++ firefox-trunk-63.0~a1~hg20180709r425475/browser/base/content/sanitize.xul 2018-07-09 12:32:49.000000000 +0000 @@ -94,44 +94,66 @@ accesskey="&detailsProgressiveDisclosure.accesskey;" control="detailsExpander"/> - - - - - - - - - + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff -Nru firefox-trunk-63.0~a1~hg20180706r425287/browser/base/content/tabbrowser.js firefox-trunk-63.0~a1~hg20180709r425475/browser/base/content/tabbrowser.js --- firefox-trunk-63.0~a1~hg20180706r425287/browser/base/content/tabbrowser.js 2018-07-06 10:54:48.000000000 +0000 +++ firefox-trunk-63.0~a1~hg20180709r425475/browser/base/content/tabbrowser.js 2018-07-09 12:32:49.000000000 +0000 @@ -4934,3 +4934,162 @@ TabsInTitlebar.allowedBy("tabs-visible", !collapse); } }; + +var TabContextMenu = { + contextTab: null, + _updateToggleMuteMenuItems(aTab, aConditionFn) { + ["muted", "soundplaying"].forEach(attr => { + if (!aConditionFn || aConditionFn(attr)) { + if (aTab.hasAttribute(attr)) { + aTab.toggleMuteMenuItem.setAttribute(attr, "true"); + aTab.toggleMultiSelectMuteMenuItem.setAttribute(attr, "true"); + } else { + aTab.toggleMuteMenuItem.removeAttribute(attr); + aTab.toggleMultiSelectMuteMenuItem.removeAttribute(attr); + } + } + }); + }, + updateContextMenu(aPopupMenu) { + this.contextTab = aPopupMenu.triggerNode.localName == "tab" ? + aPopupMenu.triggerNode : gBrowser.selectedTab; + let disabled = gBrowser.tabs.length == 1; + let multiselectionContext = this.contextTab.multiselected; + + var menuItems = aPopupMenu.getElementsByAttribute("tbattr", "tabbrowser-multiple"); + for (let menuItem of menuItems) { + menuItem.disabled = disabled; + } + + if (this.contextTab.hasAttribute("customizemode")) { + document.getElementById("context_openTabInWindow").disabled = true; + } + + disabled = gBrowser.visibleTabs.length == 1; + menuItems = aPopupMenu.getElementsByAttribute("tbattr", "tabbrowser-multiple-visible"); + for (let menuItem of menuItems) { + menuItem.disabled = disabled; + } + + // Session store + document.getElementById("context_undoCloseTab").disabled = + SessionStore.getClosedTabCount(window) == 0; + + // Only one of Reload_Tab/Reload_Selected_Tabs should be visible. + document.getElementById("context_reloadTab").hidden = multiselectionContext; + document.getElementById("context_reloadSelectedTabs").hidden = !multiselectionContext; + + // Only one of pin/unpin/multiselect-pin/multiselect-unpin should be visible + let contextPinTab = document.getElementById("context_pinTab"); + contextPinTab.hidden = this.contextTab.pinned || multiselectionContext; + let contextUnpinTab = document.getElementById("context_unpinTab"); + contextUnpinTab.hidden = !this.contextTab.pinned || multiselectionContext; + let contextPinSelectedTabs = document.getElementById("context_pinSelectedTabs"); + contextPinSelectedTabs.hidden = this.contextTab.pinned || !multiselectionContext; + let contextUnpinSelectedTabs = document.getElementById("context_unpinSelectedTabs"); + contextUnpinSelectedTabs.hidden = !this.contextTab.pinned || !multiselectionContext; + + // Disable "Close Tabs to the Right" if there are no tabs + // following it. + document.getElementById("context_closeTabsToTheEnd").disabled = + gBrowser.getTabsToTheEndFrom(this.contextTab).length == 0; + + // Disable "Close other Tabs" if there are no unpinned tabs. + let unpinnedTabsToClose = gBrowser.visibleTabs.length - gBrowser._numPinnedTabs; + if (!this.contextTab.pinned) { + unpinnedTabsToClose--; + } + document.getElementById("context_closeOtherTabs").disabled = unpinnedTabsToClose < 1; + + // Only one of close_tab/close_selected_tabs should be visible + document.getElementById("context_closeTab").hidden = multiselectionContext; + document.getElementById("context_closeSelectedTabs").hidden = !multiselectionContext; + + // Hide "Bookmark All Tabs" for a pinned tab. Update its state if visible. + let bookmarkAllTabs = document.getElementById("context_bookmarkAllTabs"); + bookmarkAllTabs.hidden = this.contextTab.pinned; + if (!bookmarkAllTabs.hidden) { + PlacesCommandHook.updateBookmarkAllTabsCommand(); + } + + let toggleMute = document.getElementById("context_toggleMuteTab"); + let toggleMultiSelectMute = document.getElementById("context_toggleMuteSelectedTabs"); + + // Only one of mute_unmute_tab/mute_unmute_selected_tabs should be visible + toggleMute.hidden = multiselectionContext; + toggleMultiSelectMute.hidden = !multiselectionContext; + + // Adjust the state of the toggle mute menu item. + if (this.contextTab.hasAttribute("activemedia-blocked")) { + toggleMute.label = gNavigatorBundle.getString("playTab.label"); + toggleMute.accessKey = gNavigatorBundle.getString("playTab.accesskey"); + } else if (this.contextTab.hasAttribute("muted")) { + toggleMute.label = gNavigatorBundle.getString("unmuteTab.label"); + toggleMute.accessKey = gNavigatorBundle.getString("unmuteTab.accesskey"); + } else { + toggleMute.label = gNavigatorBundle.getString("muteTab.label"); + toggleMute.accessKey = gNavigatorBundle.getString("muteTab.accesskey"); + } + + // Adjust the state of the toggle mute menu item for multi-selected tabs. + if (this.contextTab.hasAttribute("activemedia-blocked")) { + toggleMultiSelectMute.label = gNavigatorBundle.getString("playTabs.label"); + toggleMultiSelectMute.accessKey = gNavigatorBundle.getString("playTabs.accesskey"); + } else if (this.contextTab.hasAttribute("muted")) { + toggleMultiSelectMute.label = gNavigatorBundle.getString("unmuteSelectedTabs.label"); + toggleMultiSelectMute.accessKey = gNavigatorBundle.getString("unmuteSelectedTabs.accesskey"); + } else { + toggleMultiSelectMute.label = gNavigatorBundle.getString("muteSelectedTabs.label"); + toggleMultiSelectMute.accessKey = gNavigatorBundle.getString("muteSelectedTabs.accesskey"); + } + + this.contextTab.toggleMuteMenuItem = toggleMute; + this.contextTab.toggleMultiSelectMuteMenuItem = toggleMultiSelectMute; + this._updateToggleMuteMenuItems(this.contextTab); + + this.contextTab.addEventListener("TabAttrModified", this); + aPopupMenu.addEventListener("popuphiding", this); + + gSync.updateTabContextMenu(aPopupMenu, this.contextTab); + + document.getElementById("context_reopenInContainer").hidden = + !Services.prefs.getBoolPref("privacy.userContext.enabled", false) || + PrivateBrowsingUtils.isWindowPrivate(window); + }, + handleEvent(aEvent) { + switch (aEvent.type) { + case "popuphiding": + gBrowser.removeEventListener("TabAttrModified", this); + aEvent.target.removeEventListener("popuphiding", this); + break; + case "TabAttrModified": + let tab = aEvent.target; + this._updateToggleMuteMenuItems(tab, + attr => aEvent.detail.changed.includes(attr)); + break; + } + }, + createReopenInContainerMenu(event) { + createUserContextMenu(event, { + isContextMenu: true, + excludeUserContextId: this.contextTab.getAttribute("usercontextid"), + }); + }, + reopenInContainer(event) { + let newTab = gBrowser.addTab(this.contextTab.linkedBrowser.currentURI.spec, { + userContextId: parseInt(event.target.getAttribute("data-usercontextid")), + pinned: this.contextTab.pinned, + index: this.contextTab._tPos + 1, + }); + + if (gBrowser.selectedTab == this.contextTab) { + gBrowser.selectedTab = newTab; + } + if (this.contextTab.muted) { + if (!newTab.muted) { + newTab.toggleMuteAudio(this.contextTab.muteReason); + } + } + } +}; + diff -Nru firefox-trunk-63.0~a1~hg20180706r425287/browser/base/content/tabbrowser.xml firefox-trunk-63.0~a1~hg20180709r425475/browser/base/content/tabbrowser.xml --- firefox-trunk-63.0~a1~hg20180706r425287/browser/base/content/tabbrowser.xml 2018-07-06 10:54:48.000000000 +0000 +++ firefox-trunk-63.0~a1~hg20180709r425475/browser/base/content/tabbrowser.xml 2018-07-09 12:32:49.000000000 +0000 @@ -56,10 +56,8 @@ // Ignore overflow events: // - from nested scrollable elements // - for vertical orientation - // - when the window is tiny initially if (event.originalTarget != this._scrollbox || - event.detail == 0 || - window.outerWidth <= 1) { + event.detail == 0) { return; } diff -Nru firefox-trunk-63.0~a1~hg20180706r425287/browser/base/content/test/performance/browser.ini firefox-trunk-63.0~a1~hg20180709r425475/browser/base/content/test/performance/browser.ini --- firefox-trunk-63.0~a1~hg20180706r425287/browser/base/content/test/performance/browser.ini 2018-07-06 10:54:48.000000000 +0000 +++ firefox-trunk-63.0~a1~hg20180709r425475/browser/base/content/test/performance/browser.ini 2018-07-09 12:32:49.000000000 +0000 @@ -31,9 +31,9 @@ [browser_tabswitch.js] [browser_toolbariconcolor_restyles.js] [browser_urlbar_keyed_search.js] -skip-if = (os == 'linux') || (os == 'win' && debug) || (verify && (os == 'win')) # Disabled on Linux and Windows debug due to perma failures. Bug 1392320. +skip-if = (os == 'linux') || (os == 'win' && debug) || (os == 'win' && bits == 32) # Disabled on Linux and Windows debug due to perma failures. Bug 1392320. Disabled on Win32 because of intermittent OOM failures (bug 1448241). [browser_urlbar_search.js] -skip-if = (debug || ccov) && (os == 'linux' || os == 'win') || (verify && (os == 'win')) # Disabled on Linux and Windows debug and ccov due to intermittent timeouts. Bug 1414126, bug 1426611. +skip-if = (debug || ccov) && (os == 'linux' || os == 'win') || (os == 'win' && bits == 32) # Disabled on Linux and Windows debug and ccov due to intermittent timeouts. Bug 1414126, bug 1426611. Disabled on Win32 because of intermittent OOM failures (bug 1448241). [browser_window_resize.js] [browser_windowclose.js] [browser_windowopen.js] diff -Nru firefox-trunk-63.0~a1~hg20180706r425287/browser/base/content/test/performance/browser_startup_content.js firefox-trunk-63.0~a1~hg20180709r425475/browser/base/content/test/performance/browser_startup_content.js --- firefox-trunk-63.0~a1~hg20180706r425287/browser/base/content/test/performance/browser_startup_content.js 2018-07-06 10:54:48.000000000 +0000 +++ firefox-trunk-63.0~a1~hg20180709r425475/browser/base/content/test/performance/browser_startup_content.js 2018-07-09 12:32:49.000000000 +0000 @@ -87,6 +87,19 @@ ]), }; +// Items on this list are allowed to be loaded but not +// required, as opposed to items in the main whitelist, +// which are all required. +const intermittently_loaded_whitelist = { + components: new Set([ + "nsAsyncShutdown.js", + ]), + modules: new Set([ + "resource://gre/modules/sessionstore/Utils.jsm", + "resource://gre/modules/TelemetryStopwatch.jsm", + ]), +}; + const blacklist = { services: new Set([ "@mozilla.org/base/telemetry-startup;1", @@ -145,6 +158,10 @@ return false; }); + loadedList[scriptType] = loadedList[scriptType].filter(c => { + return !intermittently_loaded_whitelist[scriptType].has(c); + }); + is(loadedList[scriptType].length, 0, `should have no unexpected ${scriptType} loaded on content process startup`); diff -Nru firefox-trunk-63.0~a1~hg20180706r425287/browser/base/content/test/performance/browser_startup_flicker.js firefox-trunk-63.0~a1~hg20180709r425475/browser/base/content/test/performance/browser_startup_flicker.js --- firefox-trunk-63.0~a1~hg20180706r425287/browser/base/content/test/performance/browser_startup_flicker.js 2018-07-06 10:54:48.000000000 +0000 +++ firefox-trunk-63.0~a1~hg20180709r425475/browser/base/content/test/performance/browser_startup_flicker.js 2018-07-09 12:32:49.000000000 +0000 @@ -15,6 +15,7 @@ // Ensure all the frame data is in the test compartment to avoid traversing // a cross compartment wrapper for each pixel. let frames = Cu.cloneInto(startupRecorder.data.frames, {}); + ok(frames.length > 0, "Should have captured some frames."); let unexpectedRects = 0; let alreadyFocused = false; diff -Nru firefox-trunk-63.0~a1~hg20180706r425287/browser/base/content/test/sanitize/browser_sanitizeDialog.js firefox-trunk-63.0~a1~hg20180709r425475/browser/base/content/test/sanitize/browser_sanitizeDialog.js --- firefox-trunk-63.0~a1~hg20180706r425287/browser/base/content/test/sanitize/browser_sanitizeDialog.js 2018-07-06 10:54:48.000000000 +0000 +++ firefox-trunk-63.0~a1~hg20180709r425475/browser/base/content/test/sanitize/browser_sanitizeDialog.js 2018-07-09 12:32:49.000000000 +0000 @@ -362,12 +362,12 @@ wh.onload = function() { // Check that the relevant checkboxes are enabled var cb = this.win.document.querySelectorAll( - "#itemList > [preference='privacy.cpd.formdata']"); + "checkbox[preference='privacy.cpd.formdata']"); ok(cb.length == 1 && !cb[0].disabled, "There is formdata, checkbox to " + "clear formdata should be enabled."); cb = this.win.document.querySelectorAll( - "#itemList > [preference='privacy.cpd.history']"); + "checkbox[preference='privacy.cpd.history']"); ok(cb.length == 1 && !cb[0].disabled, "There is history, checkbox to " + "clear history should be enabled."); @@ -398,7 +398,7 @@ "formdata checkbox checked"); var cb = this.win.document.querySelectorAll( - "#itemList > [preference='privacy.cpd.history']"); + "checkbox[preference='privacy.cpd.history']"); ok(cb.length == 1 && !cb[0].disabled && cb[0].checked, "There is no history, but history checkbox should always be enabled " + "and will be checked from previous preference."); @@ -422,7 +422,7 @@ "dialog where you could not clear formdata."); var cb = this.win.document.querySelectorAll( - "#itemList > [preference='privacy.cpd.formdata']"); + "checkbox[preference='privacy.cpd.formdata']"); info("There exists formEntries so the checkbox should be in sync with the pref."); is(cb.length, 1, "There is only one checkbox for form data"); @@ -708,7 +708,7 @@ checkPrefCheckbox(aPrefName, aCheckState) { var pref = "privacy.cpd." + aPrefName; var cb = this.win.document.querySelectorAll( - "#itemList > [preference='" + pref + "']"); + "checkbox[preference='" + pref + "']"); is(cb.length, 1, "found checkbox for " + pref + " preference"); if (cb[0].checked != aCheckState) cb[0].click(); @@ -718,7 +718,7 @@ * Makes sure all the checkboxes are checked. */ _checkAllCheckboxesCustom(check) { - var cb = this.win.document.querySelectorAll("#itemList > [preference]"); + var cb = this.win.document.querySelectorAll("checkbox[preference]"); ok(cb.length > 1, "found checkboxes for preferences"); for (var i = 0; i < cb.length; ++i) { var pref = this.win.Preferences.get(cb[i].getAttribute("preference")); diff -Nru firefox-trunk-63.0~a1~hg20180706r425287/browser/base/content/test/sync/browser_contextmenu_sendtab.js firefox-trunk-63.0~a1~hg20180709r425475/browser/base/content/test/sync/browser_contextmenu_sendtab.js --- firefox-trunk-63.0~a1~hg20180706r425287/browser/base/content/test/sync/browser_contextmenu_sendtab.js 2018-07-06 10:54:48.000000000 +0000 +++ firefox-trunk-63.0~a1~hg20180709r425475/browser/base/content/test/sync/browser_contextmenu_sendtab.js 2018-07-09 12:32:49.000000000 +0000 @@ -18,7 +18,7 @@ var evt = new Event(""); tab.dispatchEvent(evt); menu.openPopup(tab, "end_after", 0, 0, true, false, evt); - is(TabContextMenu.contextTab, tab, "TabContextMenu context is the expected tab"); + is(window.TabContextMenu.contextTab, tab, "TabContextMenu context is the expected tab"); menu.hidePopup(); } diff -Nru firefox-trunk-63.0~a1~hg20180706r425287/browser/base/content/test/tabs/head.js firefox-trunk-63.0~a1~hg20180709r425475/browser/base/content/test/tabs/head.js --- firefox-trunk-63.0~a1~hg20180706r425287/browser/base/content/test/tabs/head.js 2018-07-06 10:54:48.000000000 +0000 +++ firefox-trunk-63.0~a1~hg20180709r425475/browser/base/content/test/tabs/head.js 2018-07-09 12:32:49.000000000 +0000 @@ -5,7 +5,7 @@ var evt = new Event(""); tab.dispatchEvent(evt); menu.openPopup(tab, "end_after", 0, 0, true, false, evt); - is(TabContextMenu.contextTab, tab, "TabContextMenu context is the expected tab"); + is(window.TabContextMenu.contextTab, tab, "TabContextMenu context is the expected tab"); menu.hidePopup(); } diff -Nru firefox-trunk-63.0~a1~hg20180706r425287/browser/base/jar.mn firefox-trunk-63.0~a1~hg20180709r425475/browser/base/jar.mn --- firefox-trunk-63.0~a1~hg20180706r425287/browser/base/jar.mn 2018-07-06 10:54:48.000000000 +0000 +++ firefox-trunk-63.0~a1~hg20180709r425475/browser/base/jar.mn 2018-07-09 12:32:49.000000000 +0000 @@ -55,7 +55,6 @@ content/browser/browser-thumbnails.js (content/browser-thumbnails.js) content/browser/browser-trackingprotection.js (content/browser-trackingprotection.js) content/browser/browser-webrender.js (content/browser-webrender.js) - content/browser/browser-window.css (content/browser-window.css) content/browser/tab-content.js (content/tab-content.js) content/browser/content.js (content/content.js) content/browser/defaultthemes/1.header.jpg (content/defaultthemes/1.header.jpg) diff -Nru firefox-trunk-63.0~a1~hg20180706r425287/browser/components/controlcenter/content/panel.inc.xul firefox-trunk-63.0~a1~hg20180709r425475/browser/components/controlcenter/content/panel.inc.xul --- firefox-trunk-63.0~a1~hg20180706r425287/browser/components/controlcenter/content/panel.inc.xul 2018-07-06 10:54:48.000000000 +0000 +++ firefox-trunk-63.0~a1~hg20180709r425475/browser/components/controlcenter/content/panel.inc.xul 2018-07-09 12:32:49.000000000 +0000 @@ -47,7 +47,7 @@ \n \n );\n }\n}\n\nexport const DisclaimerIntl = injectIntl(Disclaimer);\n\nexport class _CollapsibleSection extends React.PureComponent {\n constructor(props) {\n super(props);\n this.onBodyMount = this.onBodyMount.bind(this);\n this.onHeaderClick = this.onHeaderClick.bind(this);\n this.onTransitionEnd = this.onTransitionEnd.bind(this);\n this.enableOrDisableAnimation = this.enableOrDisableAnimation.bind(this);\n this.onMenuButtonClick = this.onMenuButtonClick.bind(this);\n this.onMenuButtonMouseEnter = this.onMenuButtonMouseEnter.bind(this);\n this.onMenuButtonMouseLeave = this.onMenuButtonMouseLeave.bind(this);\n this.onMenuUpdate = this.onMenuUpdate.bind(this);\n this.state = {enableAnimation: true, isAnimating: false, menuButtonHover: false, showContextMenu: false};\n }\n\n componentWillMount() {\n this.props.document.addEventListener(VISIBILITY_CHANGE_EVENT, this.enableOrDisableAnimation);\n }\n\n componentWillUpdate(nextProps) {\n // Check if we're about to go from expanded to collapsed\n if (!this.props.collapsed && nextProps.collapsed) {\n // This next line forces a layout flush of the section body, which has a\n // max-height style set, so that the upcoming collapse animation can\n // animate from that height to the collapsed height. Without this, the\n // update is coalesced and there's no animation from no-max-height to 0.\n this.sectionBody.scrollHeight; // eslint-disable-line no-unused-expressions\n }\n }\n\n componentWillUnmount() {\n this.props.document.removeEventListener(VISIBILITY_CHANGE_EVENT, this.enableOrDisableAnimation);\n }\n\n enableOrDisableAnimation() {\n // Only animate the collapse/expand for visible tabs.\n const visible = this.props.document.visibilityState === VISIBLE;\n if (this.state.enableAnimation !== visible) {\n this.setState({enableAnimation: visible});\n }\n }\n\n onBodyMount(node) {\n this.sectionBody = node;\n }\n\n onHeaderClick() {\n // If this.sectionBody is unset, it means that we're in some sort of error\n // state, probably displaying the error fallback, so we won't be able to\n // compute the height, and we don't want to persist the preference.\n // If props.collapsed is undefined handler shouldn't do anything.\n if (!this.sectionBody || this.props.collapsed === undefined) {\n return;\n }\n\n // Get the current height of the body so max-height transitions can work\n this.setState({\n isAnimating: true,\n maxHeight: `${this.sectionBody.scrollHeight}px`\n });\n const {action, userEvent} = SectionMenuOptions.CheckCollapsed(this.props);\n this.props.dispatch(action);\n this.props.dispatch(ac.UserEvent({\n event: userEvent,\n source: this.props.source\n }));\n }\n\n onTransitionEnd(event) {\n // Only update the animating state for our own transition (not a child's)\n if (event.target === event.currentTarget) {\n this.setState({isAnimating: false});\n }\n }\n\n renderIcon() {\n const {icon} = this.props;\n if (icon && icon.startsWith(\"moz-extension://\")) {\n return ;\n }\n return ;\n }\n\n onMenuButtonClick(event) {\n event.preventDefault();\n this.setState({showContextMenu: true});\n }\n\n onMenuButtonMouseEnter() {\n this.setState({menuButtonHover: true});\n }\n\n onMenuButtonMouseLeave() {\n this.setState({menuButtonHover: false});\n }\n\n onMenuUpdate(showContextMenu) {\n this.setState({showContextMenu});\n }\n\n render() {\n const isCollapsible = this.props.collapsed !== undefined;\n const {enableAnimation, isAnimating, maxHeight, menuButtonHover, showContextMenu} = this.state;\n const {id, eventSource, collapsed, disclaimer, title, extraMenuOptions, showPrefName, privacyNoticeURL, dispatch, isFirst, isLast, isWebExtension} = this.props;\n const disclaimerPref = `section.${id}.showDisclaimer`;\n const needsDisclaimer = disclaimer && this.props.Prefs.values[disclaimerPref];\n const active = menuButtonHover || showContextMenu;\n return (\n \n
\n

\n \n {this.renderIcon()}\n {getFormattedMessage(title)}\n {isCollapsible && }\n \n

\n
\n \n \n \n \n \n {showContextMenu &&\n \n }\n
\n
\n \n \n {needsDisclaimer && }\n {this.props.children}\n \n \n \n );\n }\n}\n\n_CollapsibleSection.defaultProps = {\n document: global.document || {\n addEventListener: () => {},\n removeEventListener: () => {},\n visibilityState: \"hidden\"\n },\n Prefs: {values: {}}\n};\n\nexport const CollapsibleSection = injectIntl(_CollapsibleSection);\n\n\n\n// WEBPACK FOOTER //\n// ./content-src/components/CollapsibleSection/CollapsibleSection.jsx","import {actionCreators as ac, actionTypes as at} from \"common/Actions.jsm\";\n\n/**\n * List of functions that return items that can be included as menu options in a\n * SectionMenu. All functions take the section as the only parameter.\n */\nexport const SectionMenuOptions = {\n Separator: () => ({type: \"separator\"}),\n MoveUp: section => ({\n id: \"section_menu_action_move_up\",\n icon: \"arrowhead-up\",\n action: ac.OnlyToMain({\n type: at.SECTION_MOVE,\n data: {id: section.id, direction: -1}\n }),\n userEvent: \"MENU_MOVE_UP\",\n disabled: !!section.isFirst\n }),\n MoveDown: section => ({\n id: \"section_menu_action_move_down\",\n icon: \"arrowhead-down\",\n action: ac.OnlyToMain({\n type: at.SECTION_MOVE,\n data: {id: section.id, direction: +1}\n }),\n userEvent: \"MENU_MOVE_DOWN\",\n disabled: !!section.isLast\n }),\n RemoveSection: section => ({\n id: \"section_menu_action_remove_section\",\n icon: \"dismiss\",\n action: ac.SetPref(section.showPrefName, false),\n userEvent: \"MENU_REMOVE\"\n }),\n CollapseSection: section => ({\n id: \"section_menu_action_collapse_section\",\n icon: \"minimize\",\n action: ac.OnlyToMain({type: at.UPDATE_SECTION_PREFS, data: {id: section.id, value: {collapsed: true}}}),\n userEvent: \"MENU_COLLAPSE\"\n }),\n ExpandSection: section => ({\n id: \"section_menu_action_expand_section\",\n icon: \"maximize\",\n action: ac.OnlyToMain({type: at.UPDATE_SECTION_PREFS, data: {id: section.id, value: {collapsed: false}}}),\n userEvent: \"MENU_EXPAND\"\n }),\n ManageSection: section => ({\n id: \"section_menu_action_manage_section\",\n icon: \"settings\",\n action: ac.OnlyToMain({type: at.SETTINGS_OPEN}),\n userEvent: \"MENU_MANAGE\"\n }),\n ManageWebExtension: section => ({\n id: \"section_menu_action_manage_webext\",\n icon: \"settings\",\n action: ac.OnlyToMain({type: at.OPEN_WEBEXT_SETTINGS, data: section.id})\n }),\n AddTopSite: section => ({\n id: \"section_menu_action_add_topsite\",\n icon: \"add\",\n action: {type: at.TOP_SITES_EDIT, data: {index: -1}},\n userEvent: \"MENU_ADD_TOPSITE\"\n }),\n PrivacyNotice: section => ({\n id: \"section_menu_action_privacy_notice\",\n icon: \"info\",\n action: ac.OnlyToMain({\n type: at.OPEN_LINK,\n data: {url: section.privacyNoticeURL}\n }),\n userEvent: \"MENU_PRIVACY_NOTICE\"\n }),\n CheckCollapsed: section => (section.collapsed ? SectionMenuOptions.ExpandSection(section) : SectionMenuOptions.CollapseSection(section))\n};\n\n\n\n// WEBPACK FOOTER //\n// ./content-src/lib/section-menu-options.js","import {actionCreators as ac, actionTypes as at} from \"common/Actions.jsm\";\nimport {perfService as perfSvc} from \"common/PerfService.jsm\";\nimport React from \"react\";\n\n// Currently record only a fixed set of sections. This will prevent data\n// from custom sections from showing up or from topstories.\nconst RECORDED_SECTIONS = [\"highlights\", \"topsites\"];\n\nexport class ComponentPerfTimer extends React.Component {\n constructor(props) {\n super(props);\n // Just for test dependency injection:\n this.perfSvc = this.props.perfSvc || perfSvc;\n\n this._sendBadStateEvent = this._sendBadStateEvent.bind(this);\n this._sendPaintedEvent = this._sendPaintedEvent.bind(this);\n this._reportMissingData = false;\n this._timestampHandled = false;\n this._recordedFirstRender = false;\n }\n\n componentDidMount() {\n if (!RECORDED_SECTIONS.includes(this.props.id)) {\n return;\n }\n\n this._maybeSendPaintedEvent();\n }\n\n componentDidUpdate() {\n if (!RECORDED_SECTIONS.includes(this.props.id)) {\n return;\n }\n\n this._maybeSendPaintedEvent();\n }\n\n /**\n * Call the given callback after the upcoming frame paints.\n *\n * @note Both setTimeout and requestAnimationFrame are throttled when the page\n * is hidden, so this callback may get called up to a second or so after the\n * requestAnimationFrame \"paint\" for hidden tabs.\n *\n * Newtabs hidden while loading will presumably be fairly rare (other than\n * preloaded tabs, which we will be filtering out on the server side), so such\n * cases should get lost in the noise.\n *\n * If we decide that it's important to find out when something that's hidden\n * has \"painted\", however, another option is to post a message to this window.\n * That should happen even faster than setTimeout, and, at least as of this\n * writing, it's not throttled in hidden windows in Firefox.\n *\n * @param {Function} callback\n *\n * @returns void\n */\n _afterFramePaint(callback) {\n requestAnimationFrame(() => setTimeout(callback, 0));\n }\n\n _maybeSendBadStateEvent() {\n // Follow up bugs:\n // https://github.com/mozilla/activity-stream/issues/3691\n if (!this.props.initialized) {\n // Remember to report back when data is available.\n this._reportMissingData = true;\n } else if (this._reportMissingData) {\n this._reportMissingData = false;\n // Report how long it took for component to become initialized.\n this._sendBadStateEvent();\n }\n }\n\n _maybeSendPaintedEvent() {\n // If we've already handled a timestamp, don't do it again.\n if (this._timestampHandled || !this.props.initialized) {\n return;\n }\n\n // And if we haven't, we're doing so now, so remember that. Even if\n // something goes wrong in the callback, we can't try again, as we'd be\n // sending back the wrong data, and we have to do it here, so that other\n // calls to this method while waiting for the next frame won't also try to\n // handle it.\n this._timestampHandled = true;\n this._afterFramePaint(this._sendPaintedEvent);\n }\n\n /**\n * Triggered by call to render. Only first call goes through due to\n * `_recordedFirstRender`.\n */\n _ensureFirstRenderTsRecorded() {\n // Used as t0 for recording how long component took to initialize.\n if (!this._recordedFirstRender) {\n this._recordedFirstRender = true;\n // topsites_first_render_ts, highlights_first_render_ts.\n const key = `${this.props.id}_first_render_ts`;\n this.perfSvc.mark(key);\n }\n }\n\n /**\n * Creates `TELEMETRY_UNDESIRED_EVENT` with timestamp in ms\n * of how much longer the data took to be ready for display than it would\n * have been the ideal case.\n * https://github.com/mozilla/ping-centre/issues/98\n */\n _sendBadStateEvent() {\n // highlights_data_ready_ts, topsites_data_ready_ts.\n const dataReadyKey = `${this.props.id}_data_ready_ts`;\n this.perfSvc.mark(dataReadyKey);\n\n try {\n const firstRenderKey = `${this.props.id}_first_render_ts`;\n // value has to be Int32.\n const value = parseInt(this.perfSvc.getMostRecentAbsMarkStartByName(dataReadyKey) -\n this.perfSvc.getMostRecentAbsMarkStartByName(firstRenderKey), 10);\n this.props.dispatch(ac.OnlyToMain({\n type: at.SAVE_SESSION_PERF_DATA,\n // highlights_data_late_by_ms, topsites_data_late_by_ms.\n data: {[`${this.props.id}_data_late_by_ms`]: value}\n }));\n } catch (ex) {\n // If this failed, it's likely because the `privacy.resistFingerprinting`\n // pref is true.\n }\n }\n\n _sendPaintedEvent() {\n // Record first_painted event but only send if topsites.\n if (this.props.id !== \"topsites\") {\n return;\n }\n\n // topsites_first_painted_ts.\n const key = `${this.props.id}_first_painted_ts`;\n this.perfSvc.mark(key);\n\n try {\n const data = {};\n data[key] = this.perfSvc.getMostRecentAbsMarkStartByName(key);\n\n this.props.dispatch(ac.OnlyToMain({\n type: at.SAVE_SESSION_PERF_DATA,\n data\n }));\n } catch (ex) {\n // If this failed, it's likely because the `privacy.resistFingerprinting`\n // pref is true. We should at least not blow up, and should continue\n // to set this._timestampHandled to avoid going through this again.\n }\n }\n\n render() {\n if (RECORDED_SECTIONS.includes(this.props.id)) {\n this._ensureFirstRenderTsRecorded();\n this._maybeSendBadStateEvent();\n }\n return this.props.children;\n }\n}\n\n\n\n// WEBPACK FOOTER //\n// ./content-src/components/ComponentPerfTimer/ComponentPerfTimer.jsx","/* globals Services */\n\"use strict\";\n\n/* istanbul ignore if */\nif (typeof ChromeUtils !== \"undefined\") {\n ChromeUtils.import(\"resource://gre/modules/Services.jsm\");\n}\n\nlet usablePerfObj;\n\n/* istanbul ignore if */\n/* istanbul ignore else */\nif (typeof Services !== \"undefined\") {\n // Borrow the high-resolution timer from the hidden window....\n usablePerfObj = Services.appShell.hiddenDOMWindow.performance;\n} else if (typeof performance !== \"undefined\") {\n // we must be running in content space\n // eslint-disable-next-line no-undef\n usablePerfObj = performance;\n} else {\n // This is a dummy object so this file doesn't crash in the node prerendering\n // task.\n usablePerfObj = {\n now() {},\n mark() {}\n };\n}\n\nfunction _PerfService(options) {\n // For testing, so that we can use a fake Window.performance object with\n // known state.\n if (options && options.performanceObj) {\n this._perf = options.performanceObj;\n } else {\n this._perf = usablePerfObj;\n }\n}\n\n_PerfService.prototype = {\n /**\n * Calls the underlying mark() method on the appropriate Window.performance\n * object to add a mark with the given name to the appropriate performance\n * timeline.\n *\n * @param {String} name the name to give the current mark\n * @return {void}\n */\n mark: function mark(str) {\n this._perf.mark(str);\n },\n\n /**\n * Calls the underlying getEntriesByName on the appropriate Window.performance\n * object.\n *\n * @param {String} name\n * @param {String} type eg \"mark\"\n * @return {Array} Performance* objects\n */\n getEntriesByName: function getEntriesByName(name, type) {\n return this._perf.getEntriesByName(name, type);\n },\n\n /**\n * The timeOrigin property from the appropriate performance object.\n * Used to ensure that timestamps from the add-on code and the content code\n * are comparable.\n *\n * @note If this is called from a context without a window\n * (eg a JSM in chrome), it will return the timeOrigin of the XUL hidden\n * window, which appears to be the first created window (and thus\n * timeOrigin) in the browser. Note also, however, there is also a private\n * hidden window, presumably for private browsing, which appears to be\n * created dynamically later. Exactly how/when that shows up needs to be\n * investigated.\n *\n * @return {Number} A double of milliseconds with a precision of 0.5us.\n */\n get timeOrigin() {\n return this._perf.timeOrigin;\n },\n\n /**\n * Returns the \"absolute\" version of performance.now(), i.e. one that\n * should ([bug 1401406](https://bugzilla.mozilla.org/show_bug.cgi?id=1401406)\n * be comparable across both chrome and content.\n *\n * @return {Number}\n */\n absNow: function absNow() {\n return this.timeOrigin + this._perf.now();\n },\n\n /**\n * This returns the absolute startTime from the most recent performance.mark()\n * with the given name.\n *\n * @param {String} name the name to lookup the start time for\n *\n * @return {Number} the returned start time, as a DOMHighResTimeStamp\n *\n * @throws {Error} \"No Marks with the name ...\" if none are available\n *\n * @note Always surround calls to this by try/catch. Otherwise your code\n * may fail when the `privacy.resistFingerprinting` pref is true. When\n * this pref is set, all attempts to get marks will likely fail, which will\n * cause this method to throw.\n *\n * See [bug 1369303](https://bugzilla.mozilla.org/show_bug.cgi?id=1369303)\n * for more info.\n */\n getMostRecentAbsMarkStartByName(name) {\n let entries = this.getEntriesByName(name, \"mark\");\n\n if (!entries.length) {\n throw new Error(`No marks with the name ${name}`);\n }\n\n let mostRecentEntry = entries[entries.length - 1];\n return this._perf.timeOrigin + mostRecentEntry.startTime;\n }\n};\n\nthis.perfService = new _PerfService();\nconst EXPORTED_SYMBOLS = [\"_PerfService\", \"perfService\"];\n\n\n\n// WEBPACK FOOTER //\n// ./common/PerfService.jsm","import {actionCreators as ac, actionTypes as at} from \"common/Actions.jsm\";\nimport {FormattedMessage, injectIntl} from \"react-intl\";\nimport {\n MIN_CORNER_FAVICON_SIZE,\n MIN_RICH_FAVICON_SIZE,\n TOP_SITES_CONTEXT_MENU_OPTIONS,\n TOP_SITES_SOURCE\n} from \"./TopSitesConstants\";\nimport {LinkMenu} from \"content-src/components/LinkMenu/LinkMenu\";\nimport React from \"react\";\nimport {ScreenshotUtils} from \"content-src/lib/screenshot-utils\";\nimport {TOP_SITES_MAX_SITES_PER_ROW} from \"common/Reducers.jsm\";\n\nexport class TopSiteLink extends React.PureComponent {\n constructor(props) {\n super(props);\n this.state = {screenshotImage: null};\n this.onDragEvent = this.onDragEvent.bind(this);\n }\n\n /*\n * Helper to determine whether the drop zone should allow a drop. We only allow\n * dropping top sites for now.\n */\n _allowDrop(e) {\n return e.dataTransfer.types.includes(\"text/topsite-index\");\n }\n\n onDragEvent(event) {\n switch (event.type) {\n case \"click\":\n // Stop any link clicks if we started any dragging\n if (this.dragged) {\n event.preventDefault();\n }\n break;\n case \"dragstart\":\n this.dragged = true;\n event.dataTransfer.effectAllowed = \"move\";\n event.dataTransfer.setData(\"text/topsite-index\", this.props.index);\n event.target.blur();\n this.props.onDragEvent(event, this.props.index, this.props.link, this.props.title);\n break;\n case \"dragend\":\n this.props.onDragEvent(event);\n break;\n case \"dragenter\":\n case \"dragover\":\n case \"drop\":\n if (this._allowDrop(event)) {\n event.preventDefault();\n this.props.onDragEvent(event, this.props.index);\n }\n break;\n case \"mousedown\":\n // Reset at the first mouse event of a potential drag\n this.dragged = false;\n break;\n }\n }\n\n /**\n * Helper to obtain the next state based on nextProps and prevState.\n *\n * NOTE: Rename this method to getDerivedStateFromProps when we update React\n * to >= 16.3. We will need to update tests as well. We cannot rename this\n * method to getDerivedStateFromProps now because there is a mismatch in\n * the React version that we are using for both testing and production.\n * (i.e. react-test-render => \"16.3.2\", react => \"16.2.0\").\n *\n * See https://github.com/airbnb/enzyme/blob/master/packages/enzyme-adapter-react-16/package.json#L43.\n */\n static getNextStateFromProps(nextProps, prevState) {\n const {screenshot} = nextProps.link;\n const imageInState = ScreenshotUtils.isRemoteImageLocal(prevState.screenshotImage, screenshot);\n if (imageInState) {\n return null;\n }\n\n // Since image was updated, attempt to revoke old image blob URL, if it exists.\n ScreenshotUtils.maybeRevokeBlobObjectURL(prevState.screenshotImage);\n\n return {screenshotImage: ScreenshotUtils.createLocalImageObject(screenshot)};\n }\n\n // NOTE: Remove this function when we update React to >= 16.3 since React will\n // call getDerivedStateFromProps automatically. We will also need to\n // rename getNextStateFromProps to getDerivedStateFromProps.\n componentWillMount() {\n const nextState = TopSiteLink.getNextStateFromProps(this.props, this.state);\n if (nextState) {\n this.setState(nextState);\n }\n }\n\n // NOTE: Remove this function when we update React to >= 16.3 since React will\n // call getDerivedStateFromProps automatically. We will also need to\n // rename getNextStateFromProps to getDerivedStateFromProps.\n componentWillReceiveProps(nextProps) {\n const nextState = TopSiteLink.getNextStateFromProps(nextProps, this.state);\n if (nextState) {\n this.setState(nextState);\n }\n }\n\n componentWillUnmount() {\n ScreenshotUtils.maybeRevokeBlobObjectURL(this.state.screenshotImage);\n }\n\n render() {\n const {children, className, defaultStyle, isDraggable, link, onClick, title} = this.props;\n const topSiteOuterClassName = `top-site-outer${className ? ` ${className}` : \"\"}${link.isDragged ? \" dragged\" : \"\"}`;\n const {tippyTopIcon, faviconSize} = link;\n const [letterFallback] = title;\n let imageClassName;\n let imageStyle;\n let showSmallFavicon = false;\n let smallFaviconStyle;\n let smallFaviconFallback;\n let hasScreenshotImage = this.state.screenshotImage && this.state.screenshotImage.url;\n if (defaultStyle) { // force no styles (letter fallback) even if the link has imagery\n smallFaviconFallback = false;\n } else if (link.customScreenshotURL) {\n // assume high quality custom screenshot and use rich icon styles and class names\n imageClassName = \"top-site-icon rich-icon\";\n imageStyle = {\n backgroundColor: link.backgroundColor,\n backgroundImage: hasScreenshotImage ? `url(${this.state.screenshotImage.url})` : \"none\"\n };\n } else if (tippyTopIcon || faviconSize >= MIN_RICH_FAVICON_SIZE) {\n // styles and class names for top sites with rich icons\n imageClassName = \"top-site-icon rich-icon\";\n imageStyle = {\n backgroundColor: link.backgroundColor,\n backgroundImage: `url(${tippyTopIcon || link.favicon})`\n };\n } else {\n // styles and class names for top sites with screenshot + small icon in top left corner\n imageClassName = `screenshot${hasScreenshotImage ? \" active\" : \"\"}`;\n imageStyle = {backgroundImage: hasScreenshotImage ? `url(${this.state.screenshotImage.url})` : \"none\"};\n\n // only show a favicon in top left if it's greater than 16x16\n if (faviconSize >= MIN_CORNER_FAVICON_SIZE) {\n showSmallFavicon = true;\n smallFaviconStyle = {backgroundImage: `url(${link.favicon})`};\n } else if (hasScreenshotImage) {\n // Don't show a small favicon if there is no screenshot, because that\n // would result in two fallback icons\n showSmallFavicon = true;\n smallFaviconFallback = true;\n }\n }\n let draggableProps = {};\n if (isDraggable) {\n draggableProps = {\n onClick: this.onDragEvent,\n onDragEnd: this.onDragEvent,\n onDragStart: this.onDragEvent,\n onMouseDown: this.onDragEvent\n };\n }\n return (
  • \n
    • );\n }\n}\nTopSiteLink.defaultProps = {\n title: \"\",\n link: {},\n isDraggable: true\n};\n\nexport class TopSite extends React.PureComponent {\n constructor(props) {\n super(props);\n this.state = {showContextMenu: false};\n this.onLinkClick = this.onLinkClick.bind(this);\n this.onMenuButtonClick = this.onMenuButtonClick.bind(this);\n this.onMenuUpdate = this.onMenuUpdate.bind(this);\n }\n\n /**\n * Report to telemetry additional information about the item.\n */\n _getTelemetryInfo() {\n const value = {icon_type: this.props.link.iconType};\n // Filter out \"not_pinned\" type for being the default\n if (this.props.link.isPinned) {\n value.card_type = \"pinned\";\n }\n return {value};\n }\n\n userEvent(event) {\n this.props.dispatch(ac.UserEvent(Object.assign({\n event,\n source: TOP_SITES_SOURCE,\n action_position: this.props.index\n }, this._getTelemetryInfo())));\n }\n\n onLinkClick(event) {\n this.userEvent(\"CLICK\");\n\n // Specially handle a top site link click for \"typed\" frecency bonus as\n // specified as a property on the link.\n event.preventDefault();\n const {altKey, button, ctrlKey, metaKey, shiftKey} = event;\n this.props.dispatch(ac.OnlyToMain({\n type: at.OPEN_LINK,\n data: Object.assign(this.props.link, {event: {altKey, button, ctrlKey, metaKey, shiftKey}})\n }));\n }\n\n onMenuButtonClick(event) {\n event.preventDefault();\n this.props.onActivate(this.props.index);\n this.setState({showContextMenu: true});\n }\n\n onMenuUpdate(showContextMenu) {\n this.setState({showContextMenu});\n }\n\n render() {\n const {props} = this;\n const {link} = props;\n const isContextMenuOpen = this.state.showContextMenu && props.activeIndex === props.index;\n const title = link.label || link.hostname;\n return (\n
    \n \n {isContextMenuOpen &&\n \n }\n
    \n     );\n }\n}\nTopSite.defaultProps = {\n link: {},\n onActivate() {}\n};\n\nexport class TopSitePlaceholder extends React.PureComponent {\n constructor(props) {\n super(props);\n this.onEditButtonClick = this.onEditButtonClick.bind(this);\n }\n\n onEditButtonClick() {\n this.props.dispatch(\n {type: at.TOP_SITES_EDIT, data: {index: this.props.index}});\n }\n\n render() {\n return (\n \n \n \n \n );\n }\n}\n\n\n\n// WEBPACK FOOTER //\n// ./content-src/asrouter/components/ModalOverlay/ModalOverlay.jsx","import {ModalOverlay} from \"../../components/ModalOverlay/ModalOverlay\";\nimport React from \"react\";\n\nclass OnboardingCard extends React.PureComponent {\n constructor(props) {\n super(props);\n this.onClick = this.onClick.bind(this);\n }\n\n onClick() {\n const {props} = this;\n props.sendUserActionTelemetry({event: \"CLICK_BUTTON\", message_id: props.id, id: props.UISurface});\n props.onAction(props.content);\n }\n\n render() {\n const {content} = this.props;\n return (\n
    \n
    \n
    \n \n

    {content.title}

    \n

    {content.text}

    \n     \n \n \n \n
    \n
    \n );\n }\n}\n\nexport class OnboardingMessage extends React.PureComponent {\n render() {\n const {props} = this;\n return (\n \n
    \n {props.bundle.map(message => (\n \n ))}\n
    \n     \n );\n }\n}\n\n\n\n// WEBPACK FOOTER //\n// ./content-src/asrouter/templates/OnboardingMessage/OnboardingMessage.jsx","import React from \"react\";\nimport {safeURI} from \"../../template-utils\";\n\nconst ALLOWED_STYLE_TAGS = [\"color\", \"backgroundColor\"];\n\nexport const Button = props => {\n const style = {};\n\n // Add allowed style tags from props, e.g. props.color becomes style={color: props.color}\n for (const tag of ALLOWED_STYLE_TAGS) {\n if (typeof props[tag] !== \"undefined\") {\n style[tag] = props[tag];\n }\n }\n // remove border if bg is set to something custom\n if (style.backgroundColor) {\n style.border = \"0\";\n }\n\n return (\n {props.children}\n );\n};\n\n\n\n// WEBPACK FOOTER //\n// ./content-src/asrouter/components/Button/Button.jsx","import React from \"react\";\n\nexport class SnippetBase extends React.PureComponent {\n constructor(props) {\n super(props);\n this.onBlockClicked = this.onBlockClicked.bind(this);\n }\n\n onBlockClicked() {\n this.props.sendUserActionTelemetry({event: \"BLOCK\", id: this.props.UISurface});\n this.props.onBlock();\n }\n\n render() {\n const {props} = this;\n\n const containerClassName = `SnippetBaseContainer${props.className ? ` ${props.className}` : \"\"}`;\n\n return (
    \n
    \n {props.children}\n
    \n
    );\n }\n}\n\n\n\n// WEBPACK FOOTER //\n// ./content-src/asrouter/components/SnippetBase/SnippetBase.jsx","import {Button} from \"../../components/Button/Button\";\nimport React from \"react\";\nimport {safeURI} from \"../../template-utils\";\nimport {SnippetBase} from \"../../components/SnippetBase/SnippetBase\";\n\nconst DEFAULT_ICON_PATH = \"chrome://branding/content/icon64.png\";\n\nexport class SimpleSnippet extends React.PureComponent {\n constructor(props) {\n super(props);\n this.onButtonClick = this.onButtonClick.bind(this);\n }\n\n onButtonClick() {\n this.props.sendUserActionTelemetry({event: \"CLICK_BUTTON\", id: this.props.UISurface});\n }\n\n renderTitle() {\n const {title} = this.props.content;\n return title ?

    {title}

    : null;\n }\n\n renderTitleIcon() {\n const titleIcon = safeURI(this.props.content.title_icon);\n return titleIcon ? : null;\n }\n\n renderButton(className) {\n const {props} = this;\n return (\n {props.content.button_label}\n );\n }\n\n render() {\n const {props} = this;\n const hasLink = props.content.button_url && props.content.button_type === \"anchor\";\n const hasButton = props.content.button_url && !props.content.button_type;\n const className = `SimpleSnippet${props.content.tall ? \" tall\" : \"\"}`;\n return (\n \n
    \n {this.renderTitleIcon()} {this.renderTitle()}

    {props.richText || props.content.text}

    {hasLink ? this.renderButton(\"ASRouterAnchor\") : null}\n
    \n {hasButton ?
    {this.renderButton()}
    : null}\n     );\n }\n}\n\n\n\n// WEBPACK FOOTER //\n// ./content-src/asrouter/templates/SimpleSnippet/SimpleSnippet.jsx","import {actionCreators as ac, actionTypes as at} from \"common/Actions.jsm\";\nimport {addLocaleData, injectIntl, IntlProvider} from \"react-intl\";\nimport {ASRouterAdmin} from \"content-src/components/ASRouterAdmin/ASRouterAdmin\";\nimport {ConfirmDialog} from \"content-src/components/ConfirmDialog/ConfirmDialog\";\nimport {connect} from \"react-redux\";\nimport {ErrorBoundary} from \"content-src/components/ErrorBoundary/ErrorBoundary\";\nimport {ManualMigration} from \"content-src/components/ManualMigration/ManualMigration\";\nimport {PrerenderData} from \"common/PrerenderData.jsm\";\nimport React from \"react\";\nimport {Search} from \"content-src/components/Search/Search\";\nimport {Sections} from \"content-src/components/Sections/Sections\";\nimport {StartupOverlay} from \"content-src/components/StartupOverlay/StartupOverlay\";\n\nconst PrefsButton = injectIntl(props => (\n
    \n
    \n));\n\n// Add the locale data for pluralization and relative-time formatting for now,\n// this just uses english locale data. We can make this more sophisticated if\n// more features are needed.\nfunction addLocaleDataForReactIntl(locale) {\n addLocaleData([{locale, parentLocale: \"en\"}]);\n}\n\nexport class _Base extends React.PureComponent {\n componentWillMount() {\n const {App, locale} = this.props;\n this.sendNewTabRehydrated(App);\n addLocaleDataForReactIntl(locale);\n }\n\n componentDidMount() {\n // Request state AFTER the first render to ensure we don't cause the\n // prerendered DOM to be unmounted. Otherwise, NEW_TAB_STATE_REQUEST is\n // dispatched right after the store is ready.\n if (this.props.isPrerendered) {\n this.props.dispatch(ac.AlsoToMain({type: at.NEW_TAB_STATE_REQUEST}));\n this.props.dispatch(ac.AlsoToMain({type: at.PAGE_PRERENDERED}));\n }\n }\n\n componentWillUnmount() {\n this.updateTheme();\n }\n\n componentWillUpdate({App}) {\n this.updateTheme();\n this.sendNewTabRehydrated(App);\n }\n\n updateTheme() {\n const bodyClassName = [\n \"activity-stream\",\n this.props.isFirstrun ? \"welcome\" : \"\"\n ].filter(v => v).join(\" \");\n global.document.body.className = bodyClassName;\n }\n\n // The NEW_TAB_REHYDRATED event is used to inform feeds that their\n // data has been consumed e.g. for counting the number of tabs that\n // have rendered that data.\n sendNewTabRehydrated(App) {\n if (App && App.initialized && !this.renderNotified) {\n this.props.dispatch(ac.AlsoToMain({type: at.NEW_TAB_REHYDRATED, data: {}}));\n this.renderNotified = true;\n }\n }\n\n render() {\n const {props} = this;\n const {App, locale, strings} = props;\n const {initialized} = App;\n\n const prefs = props.Prefs.values;\n if ((prefs.asrouterExperimentEnabled || prefs.asrouterOnboardingCohort > 0) && window.location.hash === \"#asrouter\") {\n return ();\n }\n\n if (!props.isPrerendered && !initialized) {\n return null;\n }\n\n // Until we can delete the existing onboarding tour, just hide the onboarding button when users are in\n // the new simplified onboarding experiment. CSS hacks ftw\n if (prefs.asrouterOnboardingCohort > 0) {\n global.document.body.classList.add(\"hide-onboarding\");\n }\n\n return (\n \n \n \n );\n }\n}\n\nexport class BaseContent extends React.PureComponent {\n constructor(props) {\n super(props);\n this.openPreferences = this.openPreferences.bind(this);\n }\n\n openPreferences() {\n this.props.dispatch(ac.OnlyToMain({type: at.SETTINGS_OPEN}));\n this.props.dispatch(ac.UserEvent({event: \"OPEN_NEWTAB_PREFS\"}));\n }\n\n render() {\n const {props} = this;\n const {App} = props;\n const {initialized} = App;\n const prefs = props.Prefs.values;\n\n const shouldBeFixedToTop = PrerenderData.arePrefsValid(name => prefs[name]);\n\n const outerClassName = [\n \"outer-wrapper\",\n shouldBeFixedToTop && \"fixed-to-top\"\n ].filter(v => v).join(\" \");\n\n return (\n
    \n
    \n
    \n {prefs.showSearch &&\n
    \n \n \n \n
    \n }\n
    \n {!prefs.migrationExpired &&\n
    \n \n
    \n }\n \n \n
    \n \n
    \n
    \n {this.props.isFirstrun && }\n
    );\n }\n}\n\nexport const Base = connect(state => ({App: state.App, Prefs: state.Prefs}))(_Base);\n\n\n\n// WEBPACK FOOTER //\n// ./content-src/components/Base/Base.jsx","import {ASRouterUtils} from \"../../asrouter/asrouter-content\";\nimport React from \"react\";\n\nexport class ASRouterAdmin extends React.PureComponent {\n constructor(props) {\n super(props);\n this.onMessage = this.onMessage.bind(this);\n this.findOtherBundledMessagesOfSameTemplate = this.findOtherBundledMessagesOfSameTemplate.bind(this);\n this.state = {};\n }\n\n onMessage({data: action}) {\n if (action.type === \"ADMIN_SET_STATE\") {\n this.setState(action.data);\n }\n }\n\n componentWillMount() {\n const endpoint = ASRouterUtils.getEndpoint();\n ASRouterUtils.sendMessage({type: \"ADMIN_CONNECT_STATE\", data: {endpoint}});\n ASRouterUtils.addListener(this.onMessage);\n }\n\n componentWillUnmount() {\n ASRouterUtils.removeListener(this.onMessage);\n }\n\n findOtherBundledMessagesOfSameTemplate(template) {\n return this.state.messages.filter(msg => msg.template === template && msg.bundled);\n }\n\n handleBlock(msg) {\n if (msg.bundled) {\n // If we are blocking a message that belongs to a bundle, block all other messages that are bundled of that same template\n let bundle = this.findOtherBundledMessagesOfSameTemplate(msg.template);\n return () => ASRouterUtils.blockBundle(bundle);\n }\n return () => ASRouterUtils.blockById(msg.id);\n }\n\n handleUnblock(msg) {\n if (msg.bundled) {\n // If we are unblocking a message that belongs to a bundle, unblock all other messages that are bundled of that same template\n let bundle = this.findOtherBundledMessagesOfSameTemplate(msg.template);\n return () => ASRouterUtils.unblockBundle(bundle);\n }\n return () => ASRouterUtils.unblockById(msg.id);\n }\n\n handleOverride(id) {\n return () => ASRouterUtils.overrideMessage(id);\n }\n\n renderMessageItem(msg) {\n const isCurrent = msg.id === this.state.lastMessageId;\n const isBlocked = this.state.blockList.includes(msg.id);\n\n let itemClassName = \"message-item\";\n if (isCurrent) { itemClassName += \" current\"; }\n if (isBlocked) { itemClassName += \" blocked\"; }\n\n return (\n {msg.id}\n \n \n {isBlocked ? null : }\n \n \n 
    {JSON.stringify(msg, null, 2)}
    \n \n );\n }\n\n renderMessages() {\n if (!this.state.messages) {\n return null;\n }\n return (\n {this.state.messages.map(msg => this.renderMessageItem(msg))}\n
    );\n }\n\n renderProviders() {\n return (\n {this.state.providers.map((provider, i) => (\n \n \n ))}\n
    {provider.id}{provider.type === \"remote\" ? {provider.url} : \"(local)\"}
    );\n }\n\n render() {\n return (
    \n

    AS Router Admin

    \n \n

    Message Providers

    \n {this.state.providers ? this.renderProviders() : null}\n

    Messages

    \n {this.renderMessages()}\n
    );\n }\n}\n\n\n\n// WEBPACK FOOTER //\n// ./content-src/components/ASRouterAdmin/ASRouterAdmin.jsx","import {actionCreators as ac, actionTypes} from \"common/Actions.jsm\";\nimport {connect} from \"react-redux\";\nimport {FormattedMessage} from \"react-intl\";\nimport React from \"react\";\n\n/**\n * ConfirmDialog component.\n * One primary action button, one cancel button.\n *\n * Content displayed is controlled by `data` prop the component receives.\n * Example:\n * data: {\n * // Any sort of data needed to be passed around by actions.\n * payload: site.url,\n * // Primary button AlsoToMain action.\n * action: \"DELETE_HISTORY_URL\",\n * // Primary button USerEvent action.\n * userEvent: \"DELETE\",\n * // Array of locale ids to display.\n * message_body: [\"confirm_history_delete_p1\", \"confirm_history_delete_notice_p2\"],\n * // Text for primary button.\n * confirm_button_string_id: \"menu_action_delete\"\n * },\n */\nexport class _ConfirmDialog extends React.PureComponent {\n constructor(props) {\n super(props);\n this._handleCancelBtn = this._handleCancelBtn.bind(this);\n this._handleConfirmBtn = this._handleConfirmBtn.bind(this);\n }\n\n _handleCancelBtn() {\n this.props.dispatch({type: actionTypes.DIALOG_CANCEL});\n this.props.dispatch(ac.UserEvent({event: actionTypes.DIALOG_CANCEL, source: this.props.data.eventSource}));\n }\n\n _handleConfirmBtn() {\n this.props.data.onConfirm.forEach(this.props.dispatch);\n }\n\n _renderModalMessage() {\n const message_body = this.props.data.body_string_id;\n\n if (!message_body) {\n return null;\n }\n\n return (\n {message_body.map(msg =>

    )}\n     );\n }\n\n render() {\n if (!this.props.visible) {\n return null;\n }\n\n return (
    \n
    \n
    \n
    \n {this.props.data.icon && }\n {this._renderModalMessage()}\n
    \n
    \n \n \n
    \n
    \n
    );\n }\n}\n\nexport const ConfirmDialog = connect(state => state.Dialog)(_ConfirmDialog);\n\n\n\n// WEBPACK FOOTER //\n// ./content-src/components/ConfirmDialog/ConfirmDialog.jsx","import {actionCreators as ac, actionTypes as at} from \"common/Actions.jsm\";\nimport {connect} from \"react-redux\";\nimport {FormattedMessage} from \"react-intl\";\nimport React from \"react\";\n\n/**\n * Manual migration component used to start the profile import wizard.\n * Message is presented temporarily and will go away if:\n * 1. User clicks \"No Thanks\"\n * 2. User completed the data import\n * 3. After 3 active days\n * 4. User clicks \"Cancel\" on the import wizard (currently not implemented).\n */\nexport class _ManualMigration extends React.PureComponent {\n constructor(props) {\n super(props);\n this.onLaunchTour = this.onLaunchTour.bind(this);\n this.onCancelTour = this.onCancelTour.bind(this);\n }\n\n onLaunchTour() {\n this.props.dispatch(ac.AlsoToMain({type: at.MIGRATION_START}));\n this.props.dispatch(ac.UserEvent({event: at.MIGRATION_START}));\n }\n\n onCancelTour() {\n this.props.dispatch(ac.AlsoToMain({type: at.MIGRATION_CANCEL}));\n this.props.dispatch(ac.UserEvent({event: at.MIGRATION_CANCEL}));\n }\n\n render() {\n return (
    \n

    \n \n \n

    \n
    \n \n \n
    \n
    );\n }\n}\n\nexport const ManualMigration = connect()(_ManualMigration);\n\n\n\n// WEBPACK FOOTER //\n// ./content-src/components/ManualMigration/ManualMigration.jsx","class _PrerenderData {\n constructor(options) {\n this.initialPrefs = options.initialPrefs;\n this.initialSections = options.initialSections;\n this._setValidation(options.validation);\n }\n\n get validation() {\n return this._validation;\n }\n\n set validation(value) {\n this._setValidation(value);\n }\n\n get invalidatingPrefs() {\n return this._invalidatingPrefs;\n }\n\n // This is needed so we can use it in the constructor\n _setValidation(value = []) {\n this._validation = value;\n this._invalidatingPrefs = value.reduce((result, next) => {\n if (typeof next === \"string\") {\n result.push(next);\n return result;\n } else if (next && next.oneOf) {\n return result.concat(next.oneOf);\n } else if (next && next.indexedDB) {\n return result.concat(next.indexedDB);\n }\n throw new Error(\"Your validation configuration is not properly configured\");\n }, []);\n }\n\n arePrefsValid(getPref, indexedDBPrefs) {\n for (const prefs of this.validation) {\n // {oneOf: [\"foo\", \"bar\"]}\n if (prefs && prefs.oneOf && !prefs.oneOf.some(name => getPref(name) === this.initialPrefs[name])) {\n return false;\n\n // {indexedDB: [\"foo\", \"bar\"]}\n } else if (indexedDBPrefs && prefs && prefs.indexedDB) {\n const anyModifiedPrefs = prefs.indexedDB.some(prefName => indexedDBPrefs.some(pref => pref && pref[prefName]));\n if (anyModifiedPrefs) {\n return false;\n }\n // \"foo\"\n } else if (getPref(prefs) !== this.initialPrefs[prefs]) {\n return false;\n }\n }\n return true;\n }\n}\n\nthis.PrerenderData = new _PrerenderData({\n initialPrefs: {\n \"migrationExpired\": true,\n \"feeds.topsites\": true,\n \"showSearch\": true,\n \"topSitesRows\": 1,\n \"feeds.section.topstories\": true,\n \"feeds.section.highlights\": true,\n \"sectionOrder\": \"topsites,topstories,highlights\",\n \"collapsed\": false\n },\n // Prefs listed as invalidating will prevent the prerendered version\n // of AS from being used if their value is something other than what is listed\n // here. This is required because some preferences cause the page layout to be\n // too different for the prerendered version to be used. Unfortunately, this\n // will result in users who have modified some of their preferences not being\n // able to get the benefits of prerendering.\n validation: [\n \"feeds.topsites\",\n \"showSearch\",\n \"topSitesRows\",\n \"sectionOrder\",\n // This means if either of these are set to their default values,\n // prerendering can be used.\n {oneOf: [\"feeds.section.topstories\", \"feeds.section.highlights\"]},\n // If any component has the following preference set to `true` it will\n // invalidate the prerendered version.\n {indexedDB: [\"collapsed\"]}\n ],\n initialSections: [\n {\n enabled: true,\n icon: \"pocket\",\n id: \"topstories\",\n order: 1,\n title: {id: \"header_recommended_by\", values: {provider: \"Pocket\"}}\n },\n {\n enabled: true,\n id: \"highlights\",\n icon: \"highlights\",\n order: 2,\n title: {id: \"header_highlights\"}\n }\n ]\n});\n\nthis._PrerenderData = _PrerenderData;\nconst EXPORTED_SYMBOLS = [\"PrerenderData\", \"_PrerenderData\"];\n\n\n\n// WEBPACK FOOTER //\n// ./common/PrerenderData.jsm","/* globals ContentSearchUIController */\n\"use strict\";\n\nimport {FormattedMessage, injectIntl} from \"react-intl\";\nimport {actionCreators as ac} from \"common/Actions.jsm\";\nimport {connect} from \"react-redux\";\nimport {IS_NEWTAB} from \"content-src/lib/constants\";\nimport React from \"react\";\n\nexport class _Search extends React.PureComponent {\n constructor(props) {\n super(props);\n this.onClick = this.onClick.bind(this);\n this.onInputMount = this.onInputMount.bind(this);\n }\n\n handleEvent(event) {\n // Also track search events with our own telemetry\n if (event.detail.type === \"Search\") {\n this.props.dispatch(ac.UserEvent({event: \"SEARCH\"}));\n }\n }\n\n onClick(event) {\n window.gContentSearchController.search(event);\n }\n\n componentWillUnmount() {\n delete window.gContentSearchController;\n }\n\n onInputMount(input) {\n if (input) {\n // The \"healthReportKey\" and needs to be \"newtab\" or \"abouthome\" so that\n // BrowserUsageTelemetry.jsm knows to handle events with this name, and\n // can add the appropriate telemetry probes for search. Without the correct\n // name, certain tests like browser_UsageTelemetry_content.js will fail\n // (See github ticket #2348 for more details)\n const healthReportKey = IS_NEWTAB ? \"newtab\" : \"abouthome\";\n\n // The \"searchSource\" needs to be \"newtab\" or \"homepage\" and is sent with\n // the search data and acts as context for the search request (See\n // nsISearchEngine.getSubmission). It is necessary so that search engine\n // plugins can correctly atribute referrals. (See github ticket #3321 for\n // more details)\n const searchSource = IS_NEWTAB ? \"newtab\" : \"homepage\";\n\n // gContentSearchController needs to exist as a global so that tests for\n // the existing about:home can find it; and so it allows these tests to pass.\n // In the future, when activity stream is default about:home, this can be renamed\n window.gContentSearchController = new ContentSearchUIController(input, input.parentNode,\n healthReportKey, searchSource);\n addEventListener(\"ContentSearchClient\", this);\n } else {\n window.gContentSearchController = null;\n removeEventListener(\"ContentSearchClient\", this);\n }\n }\n\n /*\n * Do not change the ID on the input field, as legacy newtab code\n * specifically looks for the id 'newtab-search-text' on input fields\n * in order to execute searches in various tests\n */\n render() {\n return (
    \n \n \n \n \n \n
    );\n }\n}\n\nexport const Search = connect()(injectIntl(_Search));\n\n\n\n// WEBPACK FOOTER //\n// ./content-src/components/Search/Search.jsx","export const IS_NEWTAB = global.document && global.document.documentURI === \"about:newtab\";\n\n\n\n// WEBPACK FOOTER //\n// ./content-src/lib/constants.js","import {Card, PlaceholderCard} from \"content-src/components/Card/Card\";\nimport {FormattedMessage, injectIntl} from \"react-intl\";\nimport {actionCreators as ac} from \"common/Actions.jsm\";\nimport {CollapsibleSection} from \"content-src/components/CollapsibleSection/CollapsibleSection\";\nimport {ComponentPerfTimer} from \"content-src/components/ComponentPerfTimer/ComponentPerfTimer\";\nimport {connect} from \"react-redux\";\nimport React from \"react\";\nimport {Topics} from \"content-src/components/Topics/Topics\";\nimport {TopSites} from \"content-src/components/TopSites/TopSites\";\n\nconst VISIBLE = \"visible\";\nconst VISIBILITY_CHANGE_EVENT = \"visibilitychange\";\nconst CARDS_PER_ROW_DEFAULT = 3;\nconst CARDS_PER_ROW_COMPACT_WIDE = 4;\n\nfunction getFormattedMessage(message) {\n return typeof message === \"string\" ? {message} : ;\n}\n\nexport class Section extends React.PureComponent {\n get numRows() {\n const {rowsPref, maxRows, Prefs} = this.props;\n return rowsPref ? Prefs.values[rowsPref] : maxRows;\n }\n\n _dispatchImpressionStats() {\n const {props} = this;\n let cardsPerRow = CARDS_PER_ROW_DEFAULT;\n if (props.compactCards && global.matchMedia(`(min-width: 1072px)`).matches) {\n // If the section has compact cards and the viewport is wide enough, we show\n // 4 columns instead of 3.\n // $break-point-widest = 1072px (from _variables.scss)\n cardsPerRow = CARDS_PER_ROW_COMPACT_WIDE;\n }\n const maxCards = cardsPerRow * this.numRows;\n const cards = props.rows.slice(0, maxCards);\n\n if (this.needsImpressionStats(cards)) {\n props.dispatch(ac.ImpressionStats({\n source: props.eventSource,\n tiles: cards.map(link => ({id: link.guid}))\n }));\n this.impressionCardGuids = cards.map(link => link.guid);\n }\n }\n\n // This sends an event when a user sees a set of new content. If content\n // changes while the page is hidden (i.e. preloaded or on a hidden tab),\n // only send the event if the page becomes visible again.\n sendImpressionStatsOrAddListener() {\n const {props} = this;\n\n if (!props.shouldSendImpressionStats || !props.dispatch) {\n return;\n }\n\n if (props.document.visibilityState === VISIBLE) {\n this._dispatchImpressionStats();\n } else {\n // We should only ever send the latest impression stats ping, so remove any\n // older listeners.\n if (this._onVisibilityChange) {\n props.document.removeEventListener(VISIBILITY_CHANGE_EVENT, this._onVisibilityChange);\n }\n\n // When the page becomes visible, send the impression stats ping if the section isn't collapsed.\n this._onVisibilityChange = () => {\n if (props.document.visibilityState === VISIBLE) {\n if (!this.props.pref.collapsed) {\n this._dispatchImpressionStats();\n }\n props.document.removeEventListener(VISIBILITY_CHANGE_EVENT, this._onVisibilityChange);\n }\n };\n props.document.addEventListener(VISIBILITY_CHANGE_EVENT, this._onVisibilityChange);\n }\n }\n\n componentDidMount() {\n if (this.props.rows.length && !this.props.pref.collapsed) {\n this.sendImpressionStatsOrAddListener();\n }\n }\n\n componentDidUpdate(prevProps) {\n const {props} = this;\n const isCollapsed = props.pref.collapsed;\n const wasCollapsed = prevProps.pref.collapsed;\n if (\n // Don't send impression stats for the empty state\n props.rows.length &&\n (\n // We only want to send impression stats if the content of the cards has changed\n // and the section is not collapsed...\n (props.rows !== prevProps.rows && !isCollapsed) ||\n // or if we are expanding a section that was collapsed.\n (wasCollapsed && !isCollapsed)\n )\n ) {\n this.sendImpressionStatsOrAddListener();\n }\n }\n\n componentWillUnmount() {\n if (this._onVisibilityChange) {\n this.props.document.removeEventListener(VISIBILITY_CHANGE_EVENT, this._onVisibilityChange);\n }\n }\n\n needsImpressionStats(cards) {\n if (!this.impressionCardGuids || (this.impressionCardGuids.length !== cards.length)) {\n return true;\n }\n\n for (let i = 0; i < cards.length; i++) {\n if (cards[i].guid !== this.impressionCardGuids[i]) {\n return true;\n }\n }\n\n return false;\n }\n\n render() {\n const {\n id, eventSource, title, icon, rows,\n emptyState, dispatch, compactCards,\n contextMenuOptions, initialized, disclaimer,\n pref, privacyNoticeURL, isFirst, isLast\n } = this.props;\n\n const maxCardsPerRow = compactCards ? CARDS_PER_ROW_COMPACT_WIDE : CARDS_PER_ROW_DEFAULT;\n const {numRows} = this;\n const maxCards = maxCardsPerRow * numRows;\n const maxCardsOnNarrow = CARDS_PER_ROW_DEFAULT * numRows;\n\n // Show topics only for top stories and if it's not initialized yet (so\n // content doesn't shift when it is loaded) or has loaded with topics\n const shouldShowTopics = (id === \"topstories\" &&\n (!this.props.topics || this.props.topics.length > 0));\n\n const realRows = rows.slice(0, maxCards);\n\n // The empty state should only be shown after we have initialized and there is no content.\n // Otherwise, we should show placeholders.\n const shouldShowEmptyState = initialized && !rows.length;\n\n const cards = [];\n if (!shouldShowEmptyState) {\n for (let i = 0; i < maxCards; i++) {\n const link = realRows[i];\n // On narrow viewports, we only show 3 cards per row. We'll mark the rest as\n // .hide-for-narrow to hide in CSS via @media query.\n const className = (i >= maxCardsOnNarrow) ? \"hide-for-narrow\" : \"\";\n cards.push(link ? (\n \n ) : (\n \n ));\n }\n }\n\n const sectionClassName = [\n \"section\",\n compactCards ? \"compact-cards\" : \"normal-cards\"\n ].join(\" \");\n\n //
    <-- React component\n //
    <-- HTML5 element\n return (\n \n\n {!shouldShowEmptyState && (
      \n {cards}\n
    )}\n {shouldShowEmptyState &&\n
    \n
    \n {emptyState.icon && emptyState.icon.startsWith(\"moz-extension://\") ?\n :\n }\n

    \n {getFormattedMessage(emptyState.message)}\n

    \n
    \n
    }\n {shouldShowTopics && }\n     \n     );\n }\n}\n\nSection.defaultProps = {\n document: global.document,\n rows: [],\n emptyState: {},\n pref: {},\n title: \"\"\n};\n\nexport const SectionIntl = connect(state => ({Prefs: state.Prefs}))(injectIntl(Section));\n\nexport class _Sections extends React.PureComponent {\n renderSections() {\n const sections = [];\n const enabledSections = this.props.Sections.filter(section => section.enabled);\n const {sectionOrder, \"feeds.topsites\": showTopSites} = this.props.Prefs.values;\n // Enabled sections doesn't include Top Sites, so we add it if enabled.\n const expectedCount = enabledSections.length + ~~showTopSites;\n\n for (const sectionId of sectionOrder.split(\",\")) {\n const commonProps = {\n key: sectionId,\n isFirst: sections.length === 0,\n isLast: sections.length === expectedCount - 1\n };\n if (sectionId === \"topsites\" && showTopSites) {\n sections.push();\n } else {\n const section = enabledSections.find(s => s.id === sectionId);\n if (section) {\n sections.push();\n }\n }\n }\n return sections;\n }\n\n render() {\n return (\n
    \n {this.renderSections()}\n
    \n );\n }\n}\n\nexport const Sections = connect(state => ({Sections: state.Sections, Prefs: state.Prefs}))(_Sections);\n\n\n\n// WEBPACK FOOTER //\n// ./content-src/components/Sections/Sections.jsx","export const cardContextTypes = {\n history: {\n intlID: \"type_label_visited\",\n icon: \"history-item\"\n },\n bookmark: {\n intlID: \"type_label_bookmarked\",\n icon: \"bookmark-added\"\n },\n trending: {\n intlID: \"type_label_recommended\",\n icon: \"trending\"\n },\n now: {\n intlID: \"type_label_now\",\n icon: \"now\"\n },\n pocket: {\n intlID: \"type_label_pocket\",\n icon: \"pocket\"\n },\n download: {\n intlID: \"type_label_downloaded\",\n icon: \"download\"\n }\n};\n\n\n\n// WEBPACK FOOTER //\n// ./content-src/components/Card/types.js","import {actionCreators as ac, actionTypes as at} from \"common/Actions.jsm\";\nimport {cardContextTypes} from \"./types\";\nimport {connect} from \"react-redux\";\nimport {FormattedMessage} from \"react-intl\";\nimport {GetPlatformString} from \"content-src/lib/link-menu-options\";\nimport {LinkMenu} from \"content-src/components/LinkMenu/LinkMenu\";\nimport React from \"react\";\nimport {ScreenshotUtils} from \"content-src/lib/screenshot-utils\";\n\n// Keep track of pending image loads to only request once\nconst gImageLoading = new Map();\n\n/**\n * Card component.\n * Cards are found within a Section component and contain information about a link such\n * as preview image, page title, page description, and some context about if the page\n * was visited, bookmarked, trending etc...\n * Each Section can make an unordered list of Cards which will create one instane of\n * this class. Each card will then get a context menu which reflects the actions that\n * can be done on this Card.\n */\nexport class _Card extends React.PureComponent {\n constructor(props) {\n super(props);\n this.state = {\n activeCard: null,\n imageLoaded: false,\n showContextMenu: false,\n cardImage: null\n };\n this.onMenuButtonClick = this.onMenuButtonClick.bind(this);\n this.onMenuUpdate = this.onMenuUpdate.bind(this);\n this.onLinkClick = this.onLinkClick.bind(this);\n }\n\n /**\n * Helper to conditionally load an image and update state when it loads.\n */\n async maybeLoadImage() {\n // No need to load if it's already loaded or no image\n const {cardImage} = this.state;\n if (!cardImage) {\n return;\n }\n\n const imageUrl = cardImage.url;\n if (!this.state.imageLoaded) {\n // Initialize a promise to share a load across multiple card updates\n if (!gImageLoading.has(imageUrl)) {\n const loaderPromise = new Promise((resolve, reject) => {\n const loader = new Image();\n loader.addEventListener(\"load\", resolve);\n loader.addEventListener(\"error\", reject);\n loader.src = imageUrl;\n });\n\n // Save and remove the promise only while it's pending\n gImageLoading.set(imageUrl, loaderPromise);\n loaderPromise.catch(ex => ex).then(() => gImageLoading.delete(imageUrl)).catch();\n }\n\n // Wait for the image whether just started loading or reused promise\n await gImageLoading.get(imageUrl);\n\n // Only update state if we're still waiting to load the original image\n if (ScreenshotUtils.isRemoteImageLocal(this.state.cardImage, this.props.link.image) &&\n !this.state.imageLoaded) {\n this.setState({imageLoaded: true});\n }\n }\n }\n\n /**\n * Helper to obtain the next state based on nextProps and prevState.\n *\n * NOTE: Rename this method to getDerivedStateFromProps when we update React\n * to >= 16.3. We will need to update tests as well. We cannot rename this\n * method to getDerivedStateFromProps now because there is a mismatch in\n * the React version that we are using for both testing and production.\n * (i.e. react-test-render => \"16.3.2\", react => \"16.2.0\").\n *\n * See https://github.com/airbnb/enzyme/blob/master/packages/enzyme-adapter-react-16/package.json#L43.\n */\n static getNextStateFromProps(nextProps, prevState) {\n const {image} = nextProps.link;\n const imageInState = ScreenshotUtils.isRemoteImageLocal(prevState.cardImage, image);\n let nextState = null;\n\n // Image is updating.\n if (!imageInState && nextProps.link) {\n nextState = {imageLoaded: false};\n }\n\n if (imageInState) {\n return nextState;\n }\n\n // Since image was updated, attempt to revoke old image blob URL, if it exists.\n ScreenshotUtils.maybeRevokeBlobObjectURL(prevState.cardImage);\n\n nextState = nextState || {};\n nextState.cardImage = ScreenshotUtils.createLocalImageObject(image);\n\n return nextState;\n }\n\n onMenuButtonClick(event) {\n event.preventDefault();\n this.setState({\n activeCard: this.props.index,\n showContextMenu: true\n });\n }\n\n /**\n * Report to telemetry additional information about the item.\n */\n _getTelemetryInfo() {\n // Filter out \"history\" type for being the default\n if (this.props.link.type !== \"history\") {\n return {value: {card_type: this.props.link.type}};\n }\n\n return null;\n }\n\n onLinkClick(event) {\n event.preventDefault();\n if (this.props.link.type === \"download\") {\n this.props.dispatch(ac.OnlyToMain({\n type: at.SHOW_DOWNLOAD_FILE,\n data: this.props.link\n }));\n } else {\n const {altKey, button, ctrlKey, metaKey, shiftKey} = event;\n this.props.dispatch(ac.OnlyToMain({\n type: at.OPEN_LINK,\n data: Object.assign(this.props.link, {event: {altKey, button, ctrlKey, metaKey, shiftKey}})\n }));\n }\n if (this.props.isWebExtension) {\n this.props.dispatch(ac.WebExtEvent(at.WEBEXT_CLICK, {\n source: this.props.eventSource,\n url: this.props.link.url,\n action_position: this.props.index\n }));\n } else {\n this.props.dispatch(ac.UserEvent(Object.assign({\n event: \"CLICK\",\n source: this.props.eventSource,\n action_position: this.props.index\n }, this._getTelemetryInfo())));\n\n if (this.props.shouldSendImpressionStats) {\n this.props.dispatch(ac.ImpressionStats({\n source: this.props.eventSource,\n click: 0,\n tiles: [{id: this.props.link.guid, pos: this.props.index}]\n }));\n }\n }\n }\n\n onMenuUpdate(showContextMenu) {\n this.setState({showContextMenu});\n }\n\n componentDidMount() {\n this.maybeLoadImage();\n }\n\n componentDidUpdate() {\n this.maybeLoadImage();\n }\n\n // NOTE: Remove this function when we update React to >= 16.3 since React will\n // call getDerivedStateFromProps automatically. We will also need to\n // rename getNextStateFromProps to getDerivedStateFromProps.\n componentWillMount() {\n const nextState = _Card.getNextStateFromProps(this.props, this.state);\n if (nextState) {\n this.setState(nextState);\n }\n }\n\n // NOTE: Remove this function when we update React to >= 16.3 since React will\n // call getDerivedStateFromProps automatically. We will also need to\n // rename getNextStateFromProps to getDerivedStateFromProps.\n componentWillReceiveProps(nextProps) {\n const nextState = _Card.getNextStateFromProps(nextProps, this.state);\n if (nextState) {\n this.setState(nextState);\n }\n }\n\n componentWillUnmount() {\n ScreenshotUtils.maybeRevokeBlobObjectURL(this.state.cardImage);\n }\n\n render() {\n const {index, className, link, dispatch, contextMenuOptions, eventSource, shouldSendImpressionStats} = this.props;\n const {props} = this;\n const isContextMenuOpen = this.state.showContextMenu && this.state.activeCard === index;\n // Display \"now\" as \"trending\" until we have new strings #3402\n const {icon, intlID} = cardContextTypes[link.type === \"now\" ? \"trending\" : link.type] || {};\n const hasImage = this.state.cardImage || link.hasImage;\n const imageStyle = {backgroundImage: this.state.cardImage ? `url(${this.state.cardImage.url})` : \"none\"};\n const outerClassName = [\n \"card-outer\",\n className,\n isContextMenuOpen && \"active\",\n props.placeholder && \"placeholder\"\n ].filter(v => v).join(\" \");\n\n return (
  • \n \n
    • );\n }\n}\n_Card.defaultProps = {link: {}};\nexport const Card = connect(state => ({platform: state.Prefs.values.platform}))(_Card);\nexport const PlaceholderCard = props => ;\n\n\n\n// WEBPACK FOOTER //\n// ./content-src/components/Card/Card.jsx","import {actionCreators as ac} from \"common/Actions.jsm\";\nimport {ContextMenu} from \"content-src/components/ContextMenu/ContextMenu\";\nimport {injectIntl} from \"react-intl\";\nimport React from \"react\";\nimport {SectionMenuOptions} from \"content-src/lib/section-menu-options\";\n\nconst DEFAULT_SECTION_MENU_OPTIONS = [\"MoveUp\", \"MoveDown\", \"Separator\", \"RemoveSection\", \"CheckCollapsed\", \"Separator\", \"ManageSection\"];\nconst WEBEXT_SECTION_MENU_OPTIONS = [\"MoveUp\", \"MoveDown\", \"Separator\", \"CheckCollapsed\", \"Separator\", \"ManageWebExtension\"];\n\nexport class _SectionMenu extends React.PureComponent {\n getOptions() {\n const {props} = this;\n\n const propOptions = props.isWebExtension ? [...WEBEXT_SECTION_MENU_OPTIONS] : [...DEFAULT_SECTION_MENU_OPTIONS];\n // Prepend custom options and a separator\n if (props.extraOptions) {\n propOptions.splice(0, 0, ...props.extraOptions, \"Separator\");\n }\n // Insert privacy notice before the last option (\"ManageSection\")\n if (props.privacyNoticeURL) {\n propOptions.splice(-1, 0, \"PrivacyNotice\");\n }\n\n const options = propOptions.map(o => SectionMenuOptions[o](props)).map(option => {\n const {action, id, type, userEvent} = option;\n if (!type && id) {\n option.label = props.intl.formatMessage({id});\n option.onClick = () => {\n props.dispatch(action);\n if (userEvent) {\n props.dispatch(ac.UserEvent({\n event: userEvent,\n source: props.source\n }));\n }\n };\n }\n return option;\n });\n\n // This is for accessibility to support making each item tabbable.\n // We want to know which item is the first and which item\n // is the last, so we can close the context menu accordingly.\n options[0].first = true;\n options[options.length - 1].last = true;\n return options;\n }\n\n render() {\n return ();\n }\n}\n\nexport const SectionMenu = injectIntl(_SectionMenu);\n\n\n\n// WEBPACK FOOTER //\n// ./content-src/components/SectionMenu/SectionMenu.jsx","import {FormattedMessage} from \"react-intl\";\nimport React from \"react\";\n\nexport class Topic extends React.PureComponent {\n render() {\n const {url, name} = this.props;\n return (
  • {name}
    • );\n }\n}\n\nexport class Topics extends React.PureComponent {\n render() {\n const {topics, read_more_endpoint} = this.props;\n return (\n
    \n \n
      {topics && topics.map(t => )}
    \n\n {read_more_endpoint && \n \n }\n
    \n );\n }\n}\n\n\n\n// WEBPACK FOOTER //\n// ./content-src/components/Topics/Topics.jsx","import {actionCreators as ac, actionTypes as at} from \"common/Actions.jsm\";\nimport {MIN_CORNER_FAVICON_SIZE, MIN_RICH_FAVICON_SIZE, TOP_SITES_SOURCE} from \"./TopSitesConstants\";\nimport {CollapsibleSection} from \"content-src/components/CollapsibleSection/CollapsibleSection\";\nimport {ComponentPerfTimer} from \"content-src/components/ComponentPerfTimer/ComponentPerfTimer\";\nimport {connect} from \"react-redux\";\nimport {injectIntl} from \"react-intl\";\nimport React from \"react\";\nimport {TOP_SITES_MAX_SITES_PER_ROW} from \"common/Reducers.jsm\";\nimport {TopSiteForm} from \"./TopSiteForm\";\nimport {TopSiteList} from \"./TopSite\";\n\nfunction topSiteIconType(link) {\n if (link.customScreenshotURL) {\n return \"custom_screenshot\";\n }\n if (link.tippyTopIcon || link.faviconRef === \"tippytop\") {\n return \"tippytop\";\n }\n if (link.faviconSize >= MIN_RICH_FAVICON_SIZE) {\n return \"rich_icon\";\n }\n if (link.screenshot && link.faviconSize >= MIN_CORNER_FAVICON_SIZE) {\n return \"screenshot_with_icon\";\n }\n if (link.screenshot) {\n return \"screenshot\";\n }\n return \"no_image\";\n}\n\n/**\n * Iterates through TopSites and counts types of images.\n * @param acc Accumulator for reducer.\n * @param topsite Entry in TopSites.\n */\nfunction countTopSitesIconsTypes(topSites) {\n const countTopSitesTypes = (acc, link) => {\n acc[topSiteIconType(link)]++;\n return acc;\n };\n\n return topSites.reduce(countTopSitesTypes, {\n \"custom_screenshot\": 0,\n \"screenshot_with_icon\": 0,\n \"screenshot\": 0,\n \"tippytop\": 0,\n \"rich_icon\": 0,\n \"no_image\": 0\n });\n}\n\nexport class _TopSites extends React.PureComponent {\n constructor(props) {\n super(props);\n this.onFormClose = this.onFormClose.bind(this);\n }\n\n /**\n * Dispatch session statistics about the quality of TopSites icons and pinned count.\n */\n _dispatchTopSitesStats() {\n const topSites = this._getVisibleTopSites();\n const topSitesIconsStats = countTopSitesIconsTypes(topSites);\n const topSitesPinned = topSites.filter(site => !!site.isPinned).length;\n // Dispatch telemetry event with the count of TopSites images types.\n this.props.dispatch(ac.AlsoToMain({\n type: at.SAVE_SESSION_PERF_DATA,\n data: {topsites_icon_stats: topSitesIconsStats, topsites_pinned: topSitesPinned}\n }));\n }\n\n /**\n * Return the TopSites that are visible based on prefs and window width.\n */\n _getVisibleTopSites() {\n // We hide 2 sites per row when not in the wide layout.\n let sitesPerRow = TOP_SITES_MAX_SITES_PER_ROW;\n // $break-point-widest = 1072px (from _variables.scss)\n if (!global.matchMedia(`(min-width: 1072px)`).matches) {\n sitesPerRow -= 2;\n }\n return this.props.TopSites.rows.slice(0, this.props.TopSitesRows * sitesPerRow);\n }\n\n componentDidUpdate() {\n this._dispatchTopSitesStats();\n }\n\n componentDidMount() {\n this._dispatchTopSitesStats();\n }\n\n onFormClose() {\n this.props.dispatch(ac.UserEvent({\n source: TOP_SITES_SOURCE,\n event: \"TOP_SITES_EDIT_CLOSE\"\n }));\n this.props.dispatch({type: at.TOP_SITES_CANCEL_EDIT});\n }\n\n render() {\n const {props} = this;\n const {editForm} = props.TopSites;\n\n return (\n \n \n
    \n {editForm &&\n
    \n
    \n
    \n \n
    \n
    \n }\n
    \n \n );\n }\n}\n\nexport const TopSites = connect(state => ({\n TopSites: state.TopSites,\n Prefs: state.Prefs,\n TopSitesRows: state.Prefs.values.topSitesRows\n}))(injectIntl(_TopSites));\n\n\n\n// WEBPACK FOOTER //\n// ./content-src/components/TopSites/TopSites.jsx","import {FormattedMessage} from \"react-intl\";\nimport React from \"react\";\n\nexport class TopSiteFormInput extends React.PureComponent {\n constructor(props) {\n super(props);\n this.state = {validationError: this.props.validationError};\n this.onChange = this.onChange.bind(this);\n this.onMount = this.onMount.bind(this);\n }\n\n componentWillReceiveProps(nextProps) {\n if (nextProps.shouldFocus && !this.props.shouldFocus) {\n this.input.focus();\n }\n if (nextProps.validationError && !this.props.validationError) {\n this.setState({validationError: true});\n }\n // If the component is in an error state but the value was cleared by the parent\n if (this.state.validationError && !nextProps.value) {\n this.setState({validationError: false});\n }\n }\n\n onChange(ev) {\n if (this.state.validationError) {\n this.setState({validationError: false});\n }\n this.props.onChange(ev);\n }\n\n onMount(input) {\n this.input = input;\n }\n\n render() {\n const showClearButton = this.props.value && this.props.onClear;\n const {typeUrl} = this.props;\n const {validationError} = this.state;\n\n return (
    \n );\n }\n}\n\n_CollapsibleSection.defaultProps = {\n document: global.document || {\n addEventListener: () => {},\n removeEventListener: () => {},\n visibilityState: \"hidden\"\n },\n Prefs: {values: {}}\n};\n\nexport const CollapsibleSection = injectIntl(_CollapsibleSection);\n","import {actionCreators as ac} from \"common/Actions.jsm\";\nimport {ContextMenu} from \"content-src/components/ContextMenu/ContextMenu\";\nimport {injectIntl} from \"react-intl\";\nimport React from \"react\";\nimport {SectionMenuOptions} from \"content-src/lib/section-menu-options\";\n\nconst DEFAULT_SECTION_MENU_OPTIONS = [\"MoveUp\", \"MoveDown\", \"Separator\", \"RemoveSection\", \"CheckCollapsed\", \"Separator\", \"ManageSection\"];\nconst WEBEXT_SECTION_MENU_OPTIONS = [\"MoveUp\", \"MoveDown\", \"Separator\", \"CheckCollapsed\", \"Separator\", \"ManageWebExtension\"];\n\nexport class _SectionMenu extends React.PureComponent {\n getOptions() {\n const {props} = this;\n\n const propOptions = props.isWebExtension ? [...WEBEXT_SECTION_MENU_OPTIONS] : [...DEFAULT_SECTION_MENU_OPTIONS];\n // Prepend custom options and a separator\n if (props.extraOptions) {\n propOptions.splice(0, 0, ...props.extraOptions, \"Separator\");\n }\n // Insert privacy notice before the last option (\"ManageSection\")\n if (props.privacyNoticeURL) {\n propOptions.splice(-1, 0, \"PrivacyNotice\");\n }\n\n const options = propOptions.map(o => SectionMenuOptions[o](props)).map(option => {\n const {action, id, type, userEvent} = option;\n if (!type && id) {\n option.label = props.intl.formatMessage({id});\n option.onClick = () => {\n props.dispatch(action);\n if (userEvent) {\n props.dispatch(ac.UserEvent({\n event: userEvent,\n source: props.source\n }));\n }\n };\n }\n return option;\n });\n\n // This is for accessibility to support making each item tabbable.\n // We want to know which item is the first and which item\n // is the last, so we can close the context menu accordingly.\n options[0].first = true;\n options[options.length - 1].last = true;\n return options;\n }\n\n render() {\n return ();\n }\n}\n\nexport const SectionMenu = injectIntl(_SectionMenu);\n","import {actionCreators as ac, actionTypes as at} from \"common/Actions.jsm\";\n\n/**\n * List of functions that return items that can be included as menu options in a\n * SectionMenu. All functions take the section as the only parameter.\n */\nexport const SectionMenuOptions = {\n Separator: () => ({type: \"separator\"}),\n MoveUp: section => ({\n id: \"section_menu_action_move_up\",\n icon: \"arrowhead-up\",\n action: ac.OnlyToMain({\n type: at.SECTION_MOVE,\n data: {id: section.id, direction: -1}\n }),\n userEvent: \"MENU_MOVE_UP\",\n disabled: !!section.isFirst\n }),\n MoveDown: section => ({\n id: \"section_menu_action_move_down\",\n icon: \"arrowhead-down\",\n action: ac.OnlyToMain({\n type: at.SECTION_MOVE,\n data: {id: section.id, direction: +1}\n }),\n userEvent: \"MENU_MOVE_DOWN\",\n disabled: !!section.isLast\n }),\n RemoveSection: section => ({\n id: \"section_menu_action_remove_section\",\n icon: \"dismiss\",\n action: ac.SetPref(section.showPrefName, false),\n userEvent: \"MENU_REMOVE\"\n }),\n CollapseSection: section => ({\n id: \"section_menu_action_collapse_section\",\n icon: \"minimize\",\n action: ac.OnlyToMain({type: at.UPDATE_SECTION_PREFS, data: {id: section.id, value: {collapsed: true}}}),\n userEvent: \"MENU_COLLAPSE\"\n }),\n ExpandSection: section => ({\n id: \"section_menu_action_expand_section\",\n icon: \"maximize\",\n action: ac.OnlyToMain({type: at.UPDATE_SECTION_PREFS, data: {id: section.id, value: {collapsed: false}}}),\n userEvent: \"MENU_EXPAND\"\n }),\n ManageSection: section => ({\n id: \"section_menu_action_manage_section\",\n icon: \"settings\",\n action: ac.OnlyToMain({type: at.SETTINGS_OPEN}),\n userEvent: \"MENU_MANAGE\"\n }),\n ManageWebExtension: section => ({\n id: \"section_menu_action_manage_webext\",\n icon: \"settings\",\n action: ac.OnlyToMain({type: at.OPEN_WEBEXT_SETTINGS, data: section.id})\n }),\n AddTopSite: section => ({\n id: \"section_menu_action_add_topsite\",\n icon: \"add\",\n action: {type: at.TOP_SITES_EDIT, data: {index: -1}},\n userEvent: \"MENU_ADD_TOPSITE\"\n }),\n PrivacyNotice: section => ({\n id: \"section_menu_action_privacy_notice\",\n icon: \"info\",\n action: ac.OnlyToMain({\n type: at.OPEN_LINK,\n data: {url: section.privacyNoticeURL}\n }),\n userEvent: \"MENU_PRIVACY_NOTICE\"\n }),\n CheckCollapsed: section => (section.collapsed ? SectionMenuOptions.ExpandSection(section) : SectionMenuOptions.CollapseSection(section))\n};\n","import {actionCreators as ac, actionTypes as at} from \"common/Actions.jsm\";\nimport {perfService as perfSvc} from \"common/PerfService.jsm\";\nimport React from \"react\";\n\n// Currently record only a fixed set of sections. This will prevent data\n// from custom sections from showing up or from topstories.\nconst RECORDED_SECTIONS = [\"highlights\", \"topsites\"];\n\nexport class ComponentPerfTimer extends React.Component {\n constructor(props) {\n super(props);\n // Just for test dependency injection:\n this.perfSvc = this.props.perfSvc || perfSvc;\n\n this._sendBadStateEvent = this._sendBadStateEvent.bind(this);\n this._sendPaintedEvent = this._sendPaintedEvent.bind(this);\n this._reportMissingData = false;\n this._timestampHandled = false;\n this._recordedFirstRender = false;\n }\n\n componentDidMount() {\n if (!RECORDED_SECTIONS.includes(this.props.id)) {\n return;\n }\n\n this._maybeSendPaintedEvent();\n }\n\n componentDidUpdate() {\n if (!RECORDED_SECTIONS.includes(this.props.id)) {\n return;\n }\n\n this._maybeSendPaintedEvent();\n }\n\n /**\n * Call the given callback after the upcoming frame paints.\n *\n * @note Both setTimeout and requestAnimationFrame are throttled when the page\n * is hidden, so this callback may get called up to a second or so after the\n * requestAnimationFrame \"paint\" for hidden tabs.\n *\n * Newtabs hidden while loading will presumably be fairly rare (other than\n * preloaded tabs, which we will be filtering out on the server side), so such\n * cases should get lost in the noise.\n *\n * If we decide that it's important to find out when something that's hidden\n * has \"painted\", however, another option is to post a message to this window.\n * That should happen even faster than setTimeout, and, at least as of this\n * writing, it's not throttled in hidden windows in Firefox.\n *\n * @param {Function} callback\n *\n * @returns void\n */\n _afterFramePaint(callback) {\n requestAnimationFrame(() => setTimeout(callback, 0));\n }\n\n _maybeSendBadStateEvent() {\n // Follow up bugs:\n // https://github.com/mozilla/activity-stream/issues/3691\n if (!this.props.initialized) {\n // Remember to report back when data is available.\n this._reportMissingData = true;\n } else if (this._reportMissingData) {\n this._reportMissingData = false;\n // Report how long it took for component to become initialized.\n this._sendBadStateEvent();\n }\n }\n\n _maybeSendPaintedEvent() {\n // If we've already handled a timestamp, don't do it again.\n if (this._timestampHandled || !this.props.initialized) {\n return;\n }\n\n // And if we haven't, we're doing so now, so remember that. Even if\n // something goes wrong in the callback, we can't try again, as we'd be\n // sending back the wrong data, and we have to do it here, so that other\n // calls to this method while waiting for the next frame won't also try to\n // handle it.\n this._timestampHandled = true;\n this._afterFramePaint(this._sendPaintedEvent);\n }\n\n /**\n * Triggered by call to render. Only first call goes through due to\n * `_recordedFirstRender`.\n */\n _ensureFirstRenderTsRecorded() {\n // Used as t0 for recording how long component took to initialize.\n if (!this._recordedFirstRender) {\n this._recordedFirstRender = true;\n // topsites_first_render_ts, highlights_first_render_ts.\n const key = `${this.props.id}_first_render_ts`;\n this.perfSvc.mark(key);\n }\n }\n\n /**\n * Creates `TELEMETRY_UNDESIRED_EVENT` with timestamp in ms\n * of how much longer the data took to be ready for display than it would\n * have been the ideal case.\n * https://github.com/mozilla/ping-centre/issues/98\n */\n _sendBadStateEvent() {\n // highlights_data_ready_ts, topsites_data_ready_ts.\n const dataReadyKey = `${this.props.id}_data_ready_ts`;\n this.perfSvc.mark(dataReadyKey);\n\n try {\n const firstRenderKey = `${this.props.id}_first_render_ts`;\n // value has to be Int32.\n const value = parseInt(this.perfSvc.getMostRecentAbsMarkStartByName(dataReadyKey) -\n this.perfSvc.getMostRecentAbsMarkStartByName(firstRenderKey), 10);\n this.props.dispatch(ac.OnlyToMain({\n type: at.SAVE_SESSION_PERF_DATA,\n // highlights_data_late_by_ms, topsites_data_late_by_ms.\n data: {[`${this.props.id}_data_late_by_ms`]: value}\n }));\n } catch (ex) {\n // If this failed, it's likely because the `privacy.resistFingerprinting`\n // pref is true.\n }\n }\n\n _sendPaintedEvent() {\n // Record first_painted event but only send if topsites.\n if (this.props.id !== \"topsites\") {\n return;\n }\n\n // topsites_first_painted_ts.\n const key = `${this.props.id}_first_painted_ts`;\n this.perfSvc.mark(key);\n\n try {\n const data = {};\n data[key] = this.perfSvc.getMostRecentAbsMarkStartByName(key);\n\n this.props.dispatch(ac.OnlyToMain({\n type: at.SAVE_SESSION_PERF_DATA,\n data\n }));\n } catch (ex) {\n // If this failed, it's likely because the `privacy.resistFingerprinting`\n // pref is true. We should at least not blow up, and should continue\n // to set this._timestampHandled to avoid going through this again.\n }\n }\n\n render() {\n if (RECORDED_SECTIONS.includes(this.props.id)) {\n this._ensureFirstRenderTsRecorded();\n this._maybeSendBadStateEvent();\n }\n return this.props.children;\n }\n}\n","/* globals Services */\n\"use strict\";\n\n/* istanbul ignore if */\nif (typeof ChromeUtils !== \"undefined\") {\n ChromeUtils.import(\"resource://gre/modules/Services.jsm\");\n}\n\nlet usablePerfObj;\n\n/* istanbul ignore if */\n/* istanbul ignore else */\nif (typeof Services !== \"undefined\") {\n // Borrow the high-resolution timer from the hidden window....\n usablePerfObj = Services.appShell.hiddenDOMWindow.performance;\n} else if (typeof performance !== \"undefined\") {\n // we must be running in content space\n // eslint-disable-next-line no-undef\n usablePerfObj = performance;\n} else {\n // This is a dummy object so this file doesn't crash in the node prerendering\n // task.\n usablePerfObj = {\n now() {},\n mark() {}\n };\n}\n\nfunction _PerfService(options) {\n // For testing, so that we can use a fake Window.performance object with\n // known state.\n if (options && options.performanceObj) {\n this._perf = options.performanceObj;\n } else {\n this._perf = usablePerfObj;\n }\n}\n\n_PerfService.prototype = {\n /**\n * Calls the underlying mark() method on the appropriate Window.performance\n * object to add a mark with the given name to the appropriate performance\n * timeline.\n *\n * @param {String} name the name to give the current mark\n * @return {void}\n */\n mark: function mark(str) {\n this._perf.mark(str);\n },\n\n /**\n * Calls the underlying getEntriesByName on the appropriate Window.performance\n * object.\n *\n * @param {String} name\n * @param {String} type eg \"mark\"\n * @return {Array} Performance* objects\n */\n getEntriesByName: function getEntriesByName(name, type) {\n return this._perf.getEntriesByName(name, type);\n },\n\n /**\n * The timeOrigin property from the appropriate performance object.\n * Used to ensure that timestamps from the add-on code and the content code\n * are comparable.\n *\n * @note If this is called from a context without a window\n * (eg a JSM in chrome), it will return the timeOrigin of the XUL hidden\n * window, which appears to be the first created window (and thus\n * timeOrigin) in the browser. Note also, however, there is also a private\n * hidden window, presumably for private browsing, which appears to be\n * created dynamically later. Exactly how/when that shows up needs to be\n * investigated.\n *\n * @return {Number} A double of milliseconds with a precision of 0.5us.\n */\n get timeOrigin() {\n return this._perf.timeOrigin;\n },\n\n /**\n * Returns the \"absolute\" version of performance.now(), i.e. one that\n * should ([bug 1401406](https://bugzilla.mozilla.org/show_bug.cgi?id=1401406)\n * be comparable across both chrome and content.\n *\n * @return {Number}\n */\n absNow: function absNow() {\n return this.timeOrigin + this._perf.now();\n },\n\n /**\n * This returns the absolute startTime from the most recent performance.mark()\n * with the given name.\n *\n * @param {String} name the name to lookup the start time for\n *\n * @return {Number} the returned start time, as a DOMHighResTimeStamp\n *\n * @throws {Error} \"No Marks with the name ...\" if none are available\n *\n * @note Always surround calls to this by try/catch. Otherwise your code\n * may fail when the `privacy.resistFingerprinting` pref is true. When\n * this pref is set, all attempts to get marks will likely fail, which will\n * cause this method to throw.\n *\n * See [bug 1369303](https://bugzilla.mozilla.org/show_bug.cgi?id=1369303)\n * for more info.\n */\n getMostRecentAbsMarkStartByName(name) {\n let entries = this.getEntriesByName(name, \"mark\");\n\n if (!entries.length) {\n throw new Error(`No marks with the name ${name}`);\n }\n\n let mostRecentEntry = entries[entries.length - 1];\n return this._perf.timeOrigin + mostRecentEntry.startTime;\n }\n};\n\nthis.perfService = new _PerfService();\nconst EXPORTED_SYMBOLS = [\"_PerfService\", \"perfService\"];\n","import {FormattedMessage} from \"react-intl\";\nimport React from \"react\";\n\nexport class Topic extends React.PureComponent {\n render() {\n const {url, name} = this.props;\n return (
  • {name}
    • );\n }\n}\n\nexport class Topics extends React.PureComponent {\n render() {\n const {topics, read_more_endpoint} = this.props;\n return (\n
    \n \n
      {topics && topics.map(t => )}
    \n\n {read_more_endpoint && \n \n }\n
    \n );\n }\n}\n","import {actionCreators as ac, actionTypes as at} from \"common/Actions.jsm\";\nimport {MIN_CORNER_FAVICON_SIZE, MIN_RICH_FAVICON_SIZE, TOP_SITES_SOURCE} from \"./TopSitesConstants\";\nimport {CollapsibleSection} from \"content-src/components/CollapsibleSection/CollapsibleSection\";\nimport {ComponentPerfTimer} from \"content-src/components/ComponentPerfTimer/ComponentPerfTimer\";\nimport {connect} from \"react-redux\";\nimport {injectIntl} from \"react-intl\";\nimport React from \"react\";\nimport {TOP_SITES_MAX_SITES_PER_ROW} from \"common/Reducers.jsm\";\nimport {TopSiteForm} from \"./TopSiteForm\";\nimport {TopSiteList} from \"./TopSite\";\n\nfunction topSiteIconType(link) {\n if (link.customScreenshotURL) {\n return \"custom_screenshot\";\n }\n if (link.tippyTopIcon || link.faviconRef === \"tippytop\") {\n return \"tippytop\";\n }\n if (link.faviconSize >= MIN_RICH_FAVICON_SIZE) {\n return \"rich_icon\";\n }\n if (link.screenshot && link.faviconSize >= MIN_CORNER_FAVICON_SIZE) {\n return \"screenshot_with_icon\";\n }\n if (link.screenshot) {\n return \"screenshot\";\n }\n return \"no_image\";\n}\n\n/**\n * Iterates through TopSites and counts types of images.\n * @param acc Accumulator for reducer.\n * @param topsite Entry in TopSites.\n */\nfunction countTopSitesIconsTypes(topSites) {\n const countTopSitesTypes = (acc, link) => {\n acc[topSiteIconType(link)]++;\n return acc;\n };\n\n return topSites.reduce(countTopSitesTypes, {\n \"custom_screenshot\": 0,\n \"screenshot_with_icon\": 0,\n \"screenshot\": 0,\n \"tippytop\": 0,\n \"rich_icon\": 0,\n \"no_image\": 0\n });\n}\n\nexport class _TopSites extends React.PureComponent {\n constructor(props) {\n super(props);\n this.onFormClose = this.onFormClose.bind(this);\n }\n\n /**\n * Dispatch session statistics about the quality of TopSites icons and pinned count.\n */\n _dispatchTopSitesStats() {\n const topSites = this._getVisibleTopSites();\n const topSitesIconsStats = countTopSitesIconsTypes(topSites);\n const topSitesPinned = topSites.filter(site => !!site.isPinned).length;\n // Dispatch telemetry event with the count of TopSites images types.\n this.props.dispatch(ac.AlsoToMain({\n type: at.SAVE_SESSION_PERF_DATA,\n data: {topsites_icon_stats: topSitesIconsStats, topsites_pinned: topSitesPinned}\n }));\n }\n\n /**\n * Return the TopSites that are visible based on prefs and window width.\n */\n _getVisibleTopSites() {\n // We hide 2 sites per row when not in the wide layout.\n let sitesPerRow = TOP_SITES_MAX_SITES_PER_ROW;\n // $break-point-widest = 1072px (from _variables.scss)\n if (!global.matchMedia(`(min-width: 1072px)`).matches) {\n sitesPerRow -= 2;\n }\n return this.props.TopSites.rows.slice(0, this.props.TopSitesRows * sitesPerRow);\n }\n\n componentDidUpdate() {\n this._dispatchTopSitesStats();\n }\n\n componentDidMount() {\n this._dispatchTopSitesStats();\n }\n\n onFormClose() {\n this.props.dispatch(ac.UserEvent({\n source: TOP_SITES_SOURCE,\n event: \"TOP_SITES_EDIT_CLOSE\"\n }));\n this.props.dispatch({type: at.TOP_SITES_CANCEL_EDIT});\n }\n\n render() {\n const {props} = this;\n const {editForm} = props.TopSites;\n\n return (\n \n \n
    \n {editForm &&\n
    \n
    \n
    \n \n
    \n
    \n }\n
    \n \n );\n }\n}\n\nexport const TopSites = connect(state => ({\n TopSites: state.TopSites,\n Prefs: state.Prefs,\n TopSitesRows: state.Prefs.values.topSitesRows\n}))(injectIntl(_TopSites));\n","export const TOP_SITES_SOURCE = \"TOP_SITES\";\nexport const TOP_SITES_CONTEXT_MENU_OPTIONS = [\"CheckPinTopSite\", \"EditTopSite\", \"Separator\",\n \"OpenInNewWindow\", \"OpenInPrivateWindow\", \"Separator\", \"BlockUrl\", \"DeleteUrl\"];\n// minimum size necessary to show a rich icon instead of a screenshot\nexport const MIN_RICH_FAVICON_SIZE = 96;\n// minimum size necessary to show any icon in the top left corner with a screenshot\nexport const MIN_CORNER_FAVICON_SIZE = 16;\n","import {actionCreators as ac, actionTypes as at} from \"common/Actions.jsm\";\nimport {FormattedMessage, injectIntl} from \"react-intl\";\nimport {\n MIN_CORNER_FAVICON_SIZE,\n MIN_RICH_FAVICON_SIZE,\n TOP_SITES_CONTEXT_MENU_OPTIONS,\n TOP_SITES_SOURCE\n} from \"./TopSitesConstants\";\nimport {LinkMenu} from \"content-src/components/LinkMenu/LinkMenu\";\nimport React from \"react\";\nimport {ScreenshotUtils} from \"content-src/lib/screenshot-utils\";\nimport {TOP_SITES_MAX_SITES_PER_ROW} from \"common/Reducers.jsm\";\n\nexport class TopSiteLink extends React.PureComponent {\n constructor(props) {\n super(props);\n this.state = {screenshotImage: null};\n this.onDragEvent = this.onDragEvent.bind(this);\n }\n\n /*\n * Helper to determine whether the drop zone should allow a drop. We only allow\n * dropping top sites for now.\n */\n _allowDrop(e) {\n return e.dataTransfer.types.includes(\"text/topsite-index\");\n }\n\n onDragEvent(event) {\n switch (event.type) {\n case \"click\":\n // Stop any link clicks if we started any dragging\n if (this.dragged) {\n event.preventDefault();\n }\n break;\n case \"dragstart\":\n this.dragged = true;\n event.dataTransfer.effectAllowed = \"move\";\n event.dataTransfer.setData(\"text/topsite-index\", this.props.index);\n event.target.blur();\n this.props.onDragEvent(event, this.props.index, this.props.link, this.props.title);\n break;\n case \"dragend\":\n this.props.onDragEvent(event);\n break;\n case \"dragenter\":\n case \"dragover\":\n case \"drop\":\n if (this._allowDrop(event)) {\n event.preventDefault();\n this.props.onDragEvent(event, this.props.index);\n }\n break;\n case \"mousedown\":\n // Reset at the first mouse event of a potential drag\n this.dragged = false;\n break;\n }\n }\n\n /**\n * Helper to obtain the next state based on nextProps and prevState.\n *\n * NOTE: Rename this method to getDerivedStateFromProps when we update React\n * to >= 16.3. We will need to update tests as well. We cannot rename this\n * method to getDerivedStateFromProps now because there is a mismatch in\n * the React version that we are using for both testing and production.\n * (i.e. react-test-render => \"16.3.2\", react => \"16.2.0\").\n *\n * See https://github.com/airbnb/enzyme/blob/master/packages/enzyme-adapter-react-16/package.json#L43.\n */\n static getNextStateFromProps(nextProps, prevState) {\n const {screenshot} = nextProps.link;\n const imageInState = ScreenshotUtils.isRemoteImageLocal(prevState.screenshotImage, screenshot);\n if (imageInState) {\n return null;\n }\n\n // Since image was updated, attempt to revoke old image blob URL, if it exists.\n ScreenshotUtils.maybeRevokeBlobObjectURL(prevState.screenshotImage);\n\n return {screenshotImage: ScreenshotUtils.createLocalImageObject(screenshot)};\n }\n\n // NOTE: Remove this function when we update React to >= 16.3 since React will\n // call getDerivedStateFromProps automatically. We will also need to\n // rename getNextStateFromProps to getDerivedStateFromProps.\n componentWillMount() {\n const nextState = TopSiteLink.getNextStateFromProps(this.props, this.state);\n if (nextState) {\n this.setState(nextState);\n }\n }\n\n // NOTE: Remove this function when we update React to >= 16.3 since React will\n // call getDerivedStateFromProps automatically. We will also need to\n // rename getNextStateFromProps to getDerivedStateFromProps.\n componentWillReceiveProps(nextProps) {\n const nextState = TopSiteLink.getNextStateFromProps(nextProps, this.state);\n if (nextState) {\n this.setState(nextState);\n }\n }\n\n componentWillUnmount() {\n ScreenshotUtils.maybeRevokeBlobObjectURL(this.state.screenshotImage);\n }\n\n render() {\n const {children, className, defaultStyle, isDraggable, link, onClick, title} = this.props;\n const topSiteOuterClassName = `top-site-outer${className ? ` ${className}` : \"\"}${link.isDragged ? \" dragged\" : \"\"}`;\n const {tippyTopIcon, faviconSize} = link;\n const [letterFallback] = title;\n let imageClassName;\n let imageStyle;\n let showSmallFavicon = false;\n let smallFaviconStyle;\n let smallFaviconFallback;\n let hasScreenshotImage = this.state.screenshotImage && this.state.screenshotImage.url;\n if (defaultStyle) { // force no styles (letter fallback) even if the link has imagery\n smallFaviconFallback = false;\n } else if (link.customScreenshotURL) {\n // assume high quality custom screenshot and use rich icon styles and class names\n imageClassName = \"top-site-icon rich-icon\";\n imageStyle = {\n backgroundColor: link.backgroundColor,\n backgroundImage: hasScreenshotImage ? `url(${this.state.screenshotImage.url})` : \"none\"\n };\n } else if (tippyTopIcon || faviconSize >= MIN_RICH_FAVICON_SIZE) {\n // styles and class names for top sites with rich icons\n imageClassName = \"top-site-icon rich-icon\";\n imageStyle = {\n backgroundColor: link.backgroundColor,\n backgroundImage: `url(${tippyTopIcon || link.favicon})`\n };\n } else {\n // styles and class names for top sites with screenshot + small icon in top left corner\n imageClassName = `screenshot${hasScreenshotImage ? \" active\" : \"\"}`;\n imageStyle = {backgroundImage: hasScreenshotImage ? `url(${this.state.screenshotImage.url})` : \"none\"};\n\n // only show a favicon in top left if it's greater than 16x16\n if (faviconSize >= MIN_CORNER_FAVICON_SIZE) {\n showSmallFavicon = true;\n smallFaviconStyle = {backgroundImage: `url(${link.favicon})`};\n } else if (hasScreenshotImage) {\n // Don't show a small favicon if there is no screenshot, because that\n // would result in two fallback icons\n showSmallFavicon = true;\n smallFaviconFallback = true;\n }\n }\n let draggableProps = {};\n if (isDraggable) {\n draggableProps = {\n onClick: this.onDragEvent,\n onDragEnd: this.onDragEvent,\n onDragStart: this.onDragEvent,\n onMouseDown: this.onDragEvent\n };\n }\n return (
  • \n
    • );\n }\n}\nTopSiteLink.defaultProps = {\n title: \"\",\n link: {},\n isDraggable: true\n};\n\nexport class TopSite extends React.PureComponent {\n constructor(props) {\n super(props);\n this.state = {showContextMenu: false};\n this.onLinkClick = this.onLinkClick.bind(this);\n this.onMenuButtonClick = this.onMenuButtonClick.bind(this);\n this.onMenuUpdate = this.onMenuUpdate.bind(this);\n }\n\n /**\n * Report to telemetry additional information about the item.\n */\n _getTelemetryInfo() {\n const value = {icon_type: this.props.link.iconType};\n // Filter out \"not_pinned\" type for being the default\n if (this.props.link.isPinned) {\n value.card_type = \"pinned\";\n }\n return {value};\n }\n\n userEvent(event) {\n this.props.dispatch(ac.UserEvent(Object.assign({\n event,\n source: TOP_SITES_SOURCE,\n action_position: this.props.index\n }, this._getTelemetryInfo())));\n }\n\n onLinkClick(event) {\n this.userEvent(\"CLICK\");\n\n // Specially handle a top site link click for \"typed\" frecency bonus as\n // specified as a property on the link.\n event.preventDefault();\n const {altKey, button, ctrlKey, metaKey, shiftKey} = event;\n this.props.dispatch(ac.OnlyToMain({\n type: at.OPEN_LINK,\n data: Object.assign(this.props.link, {event: {altKey, button, ctrlKey, metaKey, shiftKey}})\n }));\n }\n\n onMenuButtonClick(event) {\n event.preventDefault();\n this.props.onActivate(this.props.index);\n this.setState({showContextMenu: true});\n }\n\n onMenuUpdate(showContextMenu) {\n this.setState({showContextMenu});\n }\n\n render() {\n const {props} = this;\n const {link} = props;\n const isContextMenuOpen = this.state.showContextMenu && props.activeIndex === props.index;\n const title = link.label || link.hostname;\n return (\n
    \n \n {isContextMenuOpen &&\n \n }\n
    \n     );\n }\n}\nTopSite.defaultProps = {\n link: {},\n onActivate() {}\n};\n\nexport class TopSitePlaceholder extends React.PureComponent {\n constructor(props) {\n super(props);\n this.onEditButtonClick = this.onEditButtonClick.bind(this);\n }\n\n onEditButtonClick() {\n this.props.dispatch(\n {type: at.TOP_SITES_EDIT, data: {index: this.props.index}});\n }\n\n render() {\n return (\n \n \n \n
    \n
    \n
    \n \n );\n }\n}\n\nexport const StartupOverlay = connect()(injectIntl(_StartupOverlay));\n","import {actionCreators as ac, actionTypes as at} from \"common/Actions.jsm\";\nimport {perfService as perfSvc} from \"common/PerfService.jsm\";\n\nconst VISIBLE = \"visible\";\nconst VISIBILITY_CHANGE_EVENT = \"visibilitychange\";\n\nexport class DetectUserSessionStart {\n constructor(store, options = {}) {\n this._store = store;\n // Overrides for testing\n this.document = options.document || global.document;\n this._perfService = options.perfService || perfSvc;\n this._onVisibilityChange = this._onVisibilityChange.bind(this);\n }\n\n /**\n * sendEventOrAddListener - Notify immediately if the page is already visible,\n * or else set up a listener for when visibility changes.\n * This is needed for accurate session tracking for telemetry,\n * because tabs are pre-loaded.\n */\n sendEventOrAddListener() {\n if (this.document.visibilityState === VISIBLE) {\n // If the document is already visible, to the user, send a notification\n // immediately that a session has started.\n this._sendEvent();\n } else {\n // If the document is not visible, listen for when it does become visible.\n this.document.addEventListener(VISIBILITY_CHANGE_EVENT, this._onVisibilityChange);\n }\n }\n\n /**\n * _sendEvent - Sends a message to the main process to indicate the current\n * tab is now visible to the user, includes the\n * visibility_event_rcvd_ts time in ms from the UNIX epoch.\n */\n _sendEvent() {\n this._perfService.mark(\"visibility_event_rcvd_ts\");\n\n try {\n let visibility_event_rcvd_ts = this._perfService\n .getMostRecentAbsMarkStartByName(\"visibility_event_rcvd_ts\");\n\n this._store.dispatch(ac.AlsoToMain({\n type: at.SAVE_SESSION_PERF_DATA,\n data: {visibility_event_rcvd_ts}\n }));\n } catch (ex) {\n // If this failed, it's likely because the `privacy.resistFingerprinting`\n // pref is true. We should at least not blow up.\n }\n }\n\n /**\n * _onVisibilityChange - If the visibility has changed to visible, sends a notification\n * and removes the event listener. This should only be called once per tab.\n */\n _onVisibilityChange() {\n if (this.document.visibilityState === VISIBLE) {\n this._sendEvent();\n this.document.removeEventListener(VISIBILITY_CHANGE_EVENT, this._onVisibilityChange);\n }\n }\n}\n","/* eslint no-magic-numbers: [0] */\n\nconst MAX_PLACEABLES = 100;\n\nconst entryIdentifierRe = /-?[a-zA-Z][a-zA-Z0-9_-]*/y;\nconst identifierRe = /[a-zA-Z][a-zA-Z0-9_-]*/y;\nconst functionIdentifierRe = /^[A-Z][A-Z_?-]*$/;\n\n/**\n * The `Parser` class is responsible for parsing FTL resources.\n *\n * It's only public method is `getResource(source)` which takes an FTL string\n * and returns a two element Array with an Object of entries generated from the\n * source as the first element and an array of SyntaxError objects as the\n * second.\n *\n * This parser is optimized for runtime performance.\n *\n * There is an equivalent of this parser in syntax/parser which is\n * generating full AST which is useful for FTL tools.\n */\nclass RuntimeParser {\n /**\n * Parse FTL code into entries formattable by the MessageContext.\n *\n * Given a string of FTL syntax, return a map of entries that can be passed\n * to MessageContext.format and a list of errors encountered during parsing.\n *\n * @param {String} string\n * @returns {Array}\n */\n getResource(string) {\n this._source = string;\n this._index = 0;\n this._length = string.length;\n this.entries = {};\n\n const errors = [];\n\n this.skipWS();\n while (this._index < this._length) {\n try {\n this.getEntry();\n } catch (e) {\n if (e instanceof SyntaxError) {\n errors.push(e);\n\n this.skipToNextEntryStart();\n } else {\n throw e;\n }\n }\n this.skipWS();\n }\n\n return [this.entries, errors];\n }\n\n /**\n * Parse the source string from the current index as an FTL entry\n * and add it to object's entries property.\n *\n * @private\n */\n getEntry() {\n // The index here should either be at the beginning of the file\n // or right after new line.\n if (this._index !== 0 &&\n this._source[this._index - 1] !== \"\\n\") {\n throw this.error(`Expected an entry to start\n at the beginning of the file or on a new line.`);\n }\n\n const ch = this._source[this._index];\n\n // We don't care about comments or sections at runtime\n if (ch === \"/\" ||\n (ch === \"#\" &&\n [\" \", \"#\", \"\\n\"].includes(this._source[this._index + 1]))) {\n this.skipComment();\n return;\n }\n\n if (ch === \"[\") {\n this.skipSection();\n return;\n }\n\n this.getMessage();\n }\n\n /**\n * Skip the section entry from the current index.\n *\n * @private\n */\n skipSection() {\n this._index += 1;\n if (this._source[this._index] !== \"[\") {\n throw this.error('Expected \"[[\" to open a section');\n }\n\n this._index += 1;\n\n this.skipInlineWS();\n this.getVariantName();\n this.skipInlineWS();\n\n if (this._source[this._index] !== \"]\" ||\n this._source[this._index + 1] !== \"]\") {\n throw this.error('Expected \"]]\" to close a section');\n }\n\n this._index += 2;\n }\n\n /**\n * Parse the source string from the current index as an FTL message\n * and add it to the entries property on the Parser.\n *\n * @private\n */\n getMessage() {\n const id = this.getEntryIdentifier();\n\n this.skipInlineWS();\n\n if (this._source[this._index] === \"=\") {\n this._index++;\n }\n\n this.skipInlineWS();\n\n const val = this.getPattern();\n\n if (id.startsWith(\"-\") && val === null) {\n throw this.error(\"Expected term to have a value\");\n }\n\n let attrs = null;\n\n if (this._source[this._index] === \" \") {\n const lineStart = this._index;\n this.skipInlineWS();\n\n if (this._source[this._index] === \".\") {\n this._index = lineStart;\n attrs = this.getAttributes();\n }\n }\n\n if (attrs === null && typeof val === \"string\") {\n this.entries[id] = val;\n } else {\n if (val === null && attrs === null) {\n throw this.error(\"Expected message to have a value or attributes\");\n }\n\n this.entries[id] = {};\n\n if (val !== null) {\n this.entries[id].val = val;\n }\n\n if (attrs !== null) {\n this.entries[id].attrs = attrs;\n }\n }\n }\n\n /**\n * Skip whitespace.\n *\n * @private\n */\n skipWS() {\n let ch = this._source[this._index];\n while (ch === \" \" || ch === \"\\n\" || ch === \"\\t\" || ch === \"\\r\") {\n ch = this._source[++this._index];\n }\n }\n\n /**\n * Skip inline whitespace (space and \\t).\n *\n * @private\n */\n skipInlineWS() {\n let ch = this._source[this._index];\n while (ch === \" \" || ch === \"\\t\") {\n ch = this._source[++this._index];\n }\n }\n\n /**\n * Skip blank lines.\n *\n * @private\n */\n skipBlankLines() {\n while (true) {\n const ptr = this._index;\n\n this.skipInlineWS();\n\n if (this._source[this._index] === \"\\n\") {\n this._index += 1;\n } else {\n this._index = ptr;\n break;\n }\n }\n }\n\n /**\n * Get identifier using the provided regex.\n *\n * By default this will get identifiers of public messages, attributes and\n * external arguments (without the $).\n *\n * @returns {String}\n * @private\n */\n getIdentifier(re = identifierRe) {\n re.lastIndex = this._index;\n const result = re.exec(this._source);\n\n if (result === null) {\n this._index += 1;\n throw this.error(`Expected an identifier [${re.toString()}]`);\n }\n\n this._index = re.lastIndex;\n return result[0];\n }\n\n /**\n * Get identifier of a Message or a Term (staring with a dash).\n *\n * @returns {String}\n * @private\n */\n getEntryIdentifier() {\n return this.getIdentifier(entryIdentifierRe);\n }\n\n /**\n * Get Variant name.\n *\n * @returns {Object}\n * @private\n */\n getVariantName() {\n let name = \"\";\n\n const start = this._index;\n let cc = this._source.charCodeAt(this._index);\n\n if ((cc >= 97 && cc <= 122) || // a-z\n (cc >= 65 && cc <= 90) || // A-Z\n cc === 95 || cc === 32) { // _ \n cc = this._source.charCodeAt(++this._index);\n } else {\n throw this.error(\"Expected a keyword (starting with [a-zA-Z_])\");\n }\n\n while ((cc >= 97 && cc <= 122) || // a-z\n (cc >= 65 && cc <= 90) || // A-Z\n (cc >= 48 && cc <= 57) || // 0-9\n cc === 95 || cc === 45 || cc === 32) { // _- \n cc = this._source.charCodeAt(++this._index);\n }\n\n // If we encountered the end of name, we want to test if the last\n // collected character is a space.\n // If it is, we will backtrack to the last non-space character because\n // the keyword cannot end with a space character.\n while (this._source.charCodeAt(this._index - 1) === 32) {\n this._index--;\n }\n\n name += this._source.slice(start, this._index);\n\n return { type: \"varname\", name };\n }\n\n /**\n * Get simple string argument enclosed in `\"`.\n *\n * @returns {String}\n * @private\n */\n getString() {\n const start = this._index + 1;\n\n while (++this._index < this._length) {\n const ch = this._source[this._index];\n\n if (ch === '\"') {\n break;\n }\n\n if (ch === \"\\n\") {\n throw this.error(\"Unterminated string expression\");\n }\n }\n\n return this._source.substring(start, this._index++);\n }\n\n /**\n * Parses a Message pattern.\n * Message Pattern may be a simple string or an array of strings\n * and placeable expressions.\n *\n * @returns {String|Array}\n * @private\n */\n getPattern() {\n // We're going to first try to see if the pattern is simple.\n // If it is we can just look for the end of the line and read the string.\n //\n // Then, if either the line contains a placeable opening `{` or the\n // next line starts an indentation, we switch to complex pattern.\n const start = this._index;\n let eol = this._source.indexOf(\"\\n\", this._index);\n\n if (eol === -1) {\n eol = this._length;\n }\n\n const firstLineContent = start !== eol ?\n this._source.slice(start, eol) : null;\n\n if (firstLineContent && firstLineContent.includes(\"{\")) {\n return this.getComplexPattern();\n }\n\n this._index = eol + 1;\n\n this.skipBlankLines();\n\n if (this._source[this._index] !== \" \") {\n // No indentation means we're done with this message. Callers should check\n // if the return value here is null. It may be OK for messages, but not OK\n // for terms, attributes and variants.\n return firstLineContent;\n }\n\n const lineStart = this._index;\n\n this.skipInlineWS();\n\n if (this._source[this._index] === \".\") {\n // The pattern is followed by an attribute. Rewind _index to the first\n // column of the current line as expected by getAttributes.\n this._index = lineStart;\n return firstLineContent;\n }\n\n if (firstLineContent) {\n // It's a multiline pattern which started on the same line as the\n // identifier. Reparse the whole pattern to make sure we get all of it.\n this._index = start;\n }\n\n return this.getComplexPattern();\n }\n\n /**\n * Parses a complex Message pattern.\n * This function is called by getPattern when the message is multiline,\n * or contains escape chars or placeables.\n * It does full parsing of complex patterns.\n *\n * @returns {Array}\n * @private\n */\n /* eslint-disable complexity */\n getComplexPattern() {\n let buffer = \"\";\n const content = [];\n let placeables = 0;\n\n let ch = this._source[this._index];\n\n while (this._index < this._length) {\n // This block handles multi-line strings combining strings separated\n // by new line.\n if (ch === \"\\n\") {\n this._index++;\n\n // We want to capture the start and end pointers\n // around blank lines and add them to the buffer\n // but only if the blank lines are in the middle\n // of the string.\n const blankLinesStart = this._index;\n this.skipBlankLines();\n const blankLinesEnd = this._index;\n\n\n if (this._source[this._index] !== \" \") {\n break;\n }\n this.skipInlineWS();\n\n if (this._source[this._index] === \"}\" ||\n this._source[this._index] === \"[\" ||\n this._source[this._index] === \"*\" ||\n this._source[this._index] === \".\") {\n this._index = blankLinesEnd;\n break;\n }\n\n buffer += this._source.substring(blankLinesStart, blankLinesEnd);\n\n if (buffer.length || content.length) {\n buffer += \"\\n\";\n }\n ch = this._source[this._index];\n continue;\n } else if (ch === \"\\\\\") {\n const ch2 = this._source[this._index + 1];\n if (ch2 === '\"' || ch2 === \"{\" || ch2 === \"\\\\\") {\n ch = ch2;\n this._index++;\n }\n } else if (ch === \"{\") {\n // Push the buffer to content array right before placeable\n if (buffer.length) {\n content.push(buffer);\n }\n if (placeables > MAX_PLACEABLES - 1) {\n throw this.error(\n `Too many placeables, maximum allowed is ${MAX_PLACEABLES}`);\n }\n buffer = \"\";\n content.push(this.getPlaceable());\n\n this._index++;\n\n ch = this._source[this._index];\n placeables++;\n continue;\n }\n\n if (ch) {\n buffer += ch;\n }\n this._index++;\n ch = this._source[this._index];\n }\n\n if (content.length === 0) {\n return buffer.length ? buffer : null;\n }\n\n if (buffer.length) {\n content.push(buffer);\n }\n\n return content;\n }\n /* eslint-enable complexity */\n\n /**\n * Parses a single placeable in a Message pattern and returns its\n * expression.\n *\n * @returns {Object}\n * @private\n */\n getPlaceable() {\n const start = ++this._index;\n\n this.skipWS();\n\n if (this._source[this._index] === \"*\" ||\n (this._source[this._index] === \"[\" &&\n this._source[this._index + 1] !== \"]\")) {\n const variants = this.getVariants();\n\n return {\n type: \"sel\",\n exp: null,\n vars: variants[0],\n def: variants[1]\n };\n }\n\n // Rewind the index and only support in-line white-space now.\n this._index = start;\n this.skipInlineWS();\n\n const selector = this.getSelectorExpression();\n\n this.skipWS();\n\n const ch = this._source[this._index];\n\n if (ch === \"}\") {\n if (selector.type === \"attr\" && selector.id.name.startsWith(\"-\")) {\n throw this.error(\n \"Attributes of private messages cannot be interpolated.\"\n );\n }\n\n return selector;\n }\n\n if (ch !== \"-\" || this._source[this._index + 1] !== \">\") {\n throw this.error('Expected \"}\" or \"->\"');\n }\n\n if (selector.type === \"ref\") {\n throw this.error(\"Message references cannot be used as selectors.\");\n }\n\n if (selector.type === \"var\") {\n throw this.error(\"Variants cannot be used as selectors.\");\n }\n\n if (selector.type === \"attr\" && !selector.id.name.startsWith(\"-\")) {\n throw this.error(\n \"Attributes of public messages cannot be used as selectors.\"\n );\n }\n\n\n this._index += 2; // ->\n\n this.skipInlineWS();\n\n if (this._source[this._index] !== \"\\n\") {\n throw this.error(\"Variants should be listed in a new line\");\n }\n\n this.skipWS();\n\n const variants = this.getVariants();\n\n if (variants[0].length === 0) {\n throw this.error(\"Expected members for the select expression\");\n }\n\n return {\n type: \"sel\",\n exp: selector,\n vars: variants[0],\n def: variants[1]\n };\n }\n\n /**\n * Parses a selector expression.\n *\n * @returns {Object}\n * @private\n */\n getSelectorExpression() {\n const literal = this.getLiteral();\n\n if (literal.type !== \"ref\") {\n return literal;\n }\n\n if (this._source[this._index] === \".\") {\n this._index++;\n\n const name = this.getIdentifier();\n this._index++;\n return {\n type: \"attr\",\n id: literal,\n name\n };\n }\n\n if (this._source[this._index] === \"[\") {\n this._index++;\n\n const key = this.getVariantKey();\n this._index++;\n return {\n type: \"var\",\n id: literal,\n key\n };\n }\n\n if (this._source[this._index] === \"(\") {\n this._index++;\n const args = this.getCallArgs();\n\n if (!functionIdentifierRe.test(literal.name)) {\n throw this.error(\"Function names must be all upper-case\");\n }\n\n this._index++;\n\n literal.type = \"fun\";\n\n return {\n type: \"call\",\n fun: literal,\n args\n };\n }\n\n return literal;\n }\n\n /**\n * Parses call arguments for a CallExpression.\n *\n * @returns {Array}\n * @private\n */\n getCallArgs() {\n const args = [];\n\n while (this._index < this._length) {\n this.skipInlineWS();\n\n if (this._source[this._index] === \")\") {\n return args;\n }\n\n const exp = this.getSelectorExpression();\n\n // MessageReference in this place may be an entity reference, like:\n // `call(foo)`, or, if it's followed by `:` it will be a key-value pair.\n if (exp.type !== \"ref\") {\n args.push(exp);\n } else {\n this.skipInlineWS();\n\n if (this._source[this._index] === \":\") {\n this._index++;\n this.skipInlineWS();\n\n const val = this.getSelectorExpression();\n\n // If the expression returned as a value of the argument\n // is not a quote delimited string or number, throw.\n //\n // We don't have to check here if the pattern is quote delimited\n // because that's the only type of string allowed in expressions.\n if (typeof val === \"string\" ||\n Array.isArray(val) ||\n val.type === \"num\") {\n args.push({\n type: \"narg\",\n name: exp.name,\n val\n });\n } else {\n this._index = this._source.lastIndexOf(\":\", this._index) + 1;\n throw this.error(\n \"Expected string in quotes, number.\");\n }\n\n } else {\n args.push(exp);\n }\n }\n\n this.skipInlineWS();\n\n if (this._source[this._index] === \")\") {\n break;\n } else if (this._source[this._index] === \",\") {\n this._index++;\n } else {\n throw this.error('Expected \",\" or \")\"');\n }\n }\n\n return args;\n }\n\n /**\n * Parses an FTL Number.\n *\n * @returns {Object}\n * @private\n */\n getNumber() {\n let num = \"\";\n let cc = this._source.charCodeAt(this._index);\n\n // The number literal may start with negative sign `-`.\n if (cc === 45) {\n num += \"-\";\n cc = this._source.charCodeAt(++this._index);\n }\n\n // next, we expect at least one digit\n if (cc < 48 || cc > 57) {\n throw this.error(`Unknown literal \"${num}\"`);\n }\n\n // followed by potentially more digits\n while (cc >= 48 && cc <= 57) {\n num += this._source[this._index++];\n cc = this._source.charCodeAt(this._index);\n }\n\n // followed by an optional decimal separator `.`\n if (cc === 46) {\n num += this._source[this._index++];\n cc = this._source.charCodeAt(this._index);\n\n // followed by at least one digit\n if (cc < 48 || cc > 57) {\n throw this.error(`Unknown literal \"${num}\"`);\n }\n\n // and optionally more digits\n while (cc >= 48 && cc <= 57) {\n num += this._source[this._index++];\n cc = this._source.charCodeAt(this._index);\n }\n }\n\n return {\n type: \"num\",\n val: num\n };\n }\n\n /**\n * Parses a list of Message attributes.\n *\n * @returns {Object}\n * @private\n */\n getAttributes() {\n const attrs = {};\n\n while (this._index < this._length) {\n if (this._source[this._index] !== \" \") {\n break;\n }\n this.skipInlineWS();\n\n if (this._source[this._index] !== \".\") {\n break;\n }\n this._index++;\n\n const key = this.getIdentifier();\n\n this.skipInlineWS();\n\n if (this._source[this._index] !== \"=\") {\n throw this.error('Expected \"=\"');\n }\n this._index++;\n\n this.skipInlineWS();\n\n const val = this.getPattern();\n\n if (val === null) {\n throw this.error(\"Expected attribute to have a value\");\n }\n\n if (typeof val === \"string\") {\n attrs[key] = val;\n } else {\n attrs[key] = {\n val\n };\n }\n\n this.skipBlankLines();\n }\n\n return attrs;\n }\n\n /**\n * Parses a list of Selector variants.\n *\n * @returns {Array}\n * @private\n */\n getVariants() {\n const variants = [];\n let index = 0;\n let defaultIndex;\n\n while (this._index < this._length) {\n const ch = this._source[this._index];\n\n if ((ch !== \"[\" || this._source[this._index + 1] === \"[\") &&\n ch !== \"*\") {\n break;\n }\n if (ch === \"*\") {\n this._index++;\n defaultIndex = index;\n }\n\n if (this._source[this._index] !== \"[\") {\n throw this.error('Expected \"[\"');\n }\n\n this._index++;\n\n const key = this.getVariantKey();\n\n this.skipInlineWS();\n\n const val = this.getPattern();\n\n if (val === null) {\n throw this.error(\"Expected variant to have a value\");\n }\n\n variants[index++] = {key, val};\n\n this.skipWS();\n }\n\n return [variants, defaultIndex];\n }\n\n /**\n * Parses a Variant key.\n *\n * @returns {String}\n * @private\n */\n getVariantKey() {\n // VariantKey may be a Keyword or Number\n\n const cc = this._source.charCodeAt(this._index);\n let literal;\n\n if ((cc >= 48 && cc <= 57) || cc === 45) {\n literal = this.getNumber();\n } else {\n literal = this.getVariantName();\n }\n\n if (this._source[this._index] !== \"]\") {\n throw this.error('Expected \"]\"');\n }\n\n this._index++;\n return literal;\n }\n\n /**\n * Parses an FTL literal.\n *\n * @returns {Object}\n * @private\n */\n getLiteral() {\n const cc0 = this._source.charCodeAt(this._index);\n\n if (cc0 === 36) { // $\n this._index++;\n return {\n type: \"ext\",\n name: this.getIdentifier()\n };\n }\n\n const cc1 = cc0 === 45 // -\n // Peek at the next character after the dash.\n ? this._source.charCodeAt(this._index + 1)\n // Or keep using the character at the current index.\n : cc0;\n\n if ((cc1 >= 97 && cc1 <= 122) || // a-z\n (cc1 >= 65 && cc1 <= 90)) { // A-Z\n return {\n type: \"ref\",\n name: this.getEntryIdentifier()\n };\n }\n\n if ((cc1 >= 48 && cc1 <= 57)) { // 0-9\n return this.getNumber();\n }\n\n if (cc0 === 34) { // \"\n return this.getString();\n }\n\n throw this.error(\"Expected literal\");\n }\n\n /**\n * Skips an FTL comment.\n *\n * @private\n */\n skipComment() {\n // At runtime, we don't care about comments so we just have\n // to parse them properly and skip their content.\n let eol = this._source.indexOf(\"\\n\", this._index);\n\n while (eol !== -1 &&\n ((this._source[eol + 1] === \"/\" && this._source[eol + 2] === \"/\") ||\n (this._source[eol + 1] === \"#\" &&\n [\" \", \"#\"].includes(this._source[eol + 2])))) {\n this._index = eol + 3;\n\n eol = this._source.indexOf(\"\\n\", this._index);\n\n if (eol === -1) {\n break;\n }\n }\n\n if (eol === -1) {\n this._index = this._length;\n } else {\n this._index = eol + 1;\n }\n }\n\n /**\n * Creates a new SyntaxError object with a given message.\n *\n * @param {String} message\n * @returns {Object}\n * @private\n */\n error(message) {\n return new SyntaxError(message);\n }\n\n /**\n * Skips to the beginning of a next entry after the current position.\n * This is used to mark the boundary of junk entry in case of error,\n * and recover from the returned position.\n *\n * @private\n */\n skipToNextEntryStart() {\n let start = this._index;\n\n while (true) {\n if (start === 0 || this._source[start - 1] === \"\\n\") {\n const cc = this._source.charCodeAt(start);\n\n if ((cc >= 97 && cc <= 122) || // a-z\n (cc >= 65 && cc <= 90) || // A-Z\n cc === 47 || cc === 91) { // /[\n this._index = start;\n return;\n }\n }\n\n start = this._source.indexOf(\"\\n\", start);\n\n if (start === -1) {\n this._index = this._length;\n return;\n }\n start++;\n }\n }\n}\n\n/**\n * Parses an FTL string using RuntimeParser and returns the generated\n * object with entries and a list of errors.\n *\n * @param {String} string\n * @returns {Array}\n */\nexport default function parse(string) {\n const parser = new RuntimeParser();\n return parser.getResource(string);\n}\n","/* global Intl */\n\n/**\n * The `FluentType` class is the base of Fluent's type system.\n *\n * Fluent types wrap JavaScript values and store additional configuration for\n * them, which can then be used in the `toString` method together with a proper\n * `Intl` formatter.\n */\nexport class FluentType {\n\n /**\n * Create an `FluentType` instance.\n *\n * @param {Any} value - JavaScript value to wrap.\n * @param {Object} opts - Configuration.\n * @returns {FluentType}\n */\n constructor(value, opts) {\n this.value = value;\n this.opts = opts;\n }\n\n /**\n * Unwrap the raw value stored by this `FluentType`.\n *\n * @returns {Any}\n */\n valueOf() {\n return this.value;\n }\n\n /**\n * Format this instance of `FluentType` to a string.\n *\n * Formatted values are suitable for use outside of the `MessageContext`.\n * This method can use `Intl` formatters memoized by the `MessageContext`\n * instance passed as an argument.\n *\n * @param {MessageContext} [ctx]\n * @returns {string}\n */\n toString() {\n throw new Error(\"Subclasses of FluentType must implement toString.\");\n }\n}\n\nexport class FluentNone extends FluentType {\n toString() {\n return this.value || \"???\";\n }\n}\n\nexport class FluentNumber extends FluentType {\n constructor(value, opts) {\n super(parseFloat(value), opts);\n }\n\n toString(ctx) {\n try {\n const nf = ctx._memoizeIntlObject(\n Intl.NumberFormat, this.opts\n );\n return nf.format(this.value);\n } catch (e) {\n // XXX Report the error.\n return this.value;\n }\n }\n\n /**\n * Compare the object with another instance of a FluentType.\n *\n * @param {MessageContext} ctx\n * @param {FluentType} other\n * @returns {bool}\n */\n match(ctx, other) {\n if (other instanceof FluentNumber) {\n return this.value === other.value;\n }\n return false;\n }\n}\n\nexport class FluentDateTime extends FluentType {\n constructor(value, opts) {\n super(new Date(value), opts);\n }\n\n toString(ctx) {\n try {\n const dtf = ctx._memoizeIntlObject(\n Intl.DateTimeFormat, this.opts\n );\n return dtf.format(this.value);\n } catch (e) {\n // XXX Report the error.\n return this.value;\n }\n }\n}\n\nexport class FluentSymbol extends FluentType {\n toString() {\n return this.value;\n }\n\n /**\n * Compare the object with another instance of a FluentType.\n *\n * @param {MessageContext} ctx\n * @param {FluentType} other\n * @returns {bool}\n */\n match(ctx, other) {\n if (other instanceof FluentSymbol) {\n return this.value === other.value;\n } else if (typeof other === \"string\") {\n return this.value === other;\n } else if (other instanceof FluentNumber) {\n const pr = ctx._memoizeIntlObject(\n Intl.PluralRules, other.opts\n );\n return this.value === pr.select(other.value);\n }\n return false;\n }\n}\n","/**\n * @overview\n *\n * The FTL resolver ships with a number of functions built-in.\n *\n * Each function take two arguments:\n * - args - an array of positional args\n * - opts - an object of key-value args\n *\n * Arguments to functions are guaranteed to already be instances of\n * `FluentType`. Functions must return `FluentType` objects as well.\n */\n\nimport { FluentNumber, FluentDateTime } from \"./types\";\n\nexport default {\n \"NUMBER\": ([arg], opts) =>\n new FluentNumber(arg.valueOf(), merge(arg.opts, opts)),\n \"DATETIME\": ([arg], opts) =>\n new FluentDateTime(arg.valueOf(), merge(arg.opts, opts)),\n};\n\nfunction merge(argopts, opts) {\n return Object.assign({}, argopts, values(opts));\n}\n\nfunction values(opts) {\n const unwrapped = {};\n for (const [name, opt] of Object.entries(opts)) {\n unwrapped[name] = opt.valueOf();\n }\n return unwrapped;\n}\n","/**\n * @overview\n *\n * The role of the Fluent resolver is to format a translation object to an\n * instance of `FluentType` or an array of instances.\n *\n * Translations can contain references to other messages or external arguments,\n * conditional logic in form of select expressions, traits which describe their\n * grammatical features, and can use Fluent builtins which make use of the\n * `Intl` formatters to format numbers, dates, lists and more into the\n * context's language. See the documentation of the Fluent syntax for more\n * information.\n *\n * In case of errors the resolver will try to salvage as much of the\n * translation as possible. In rare situations where the resolver didn't know\n * how to recover from an error it will return an instance of `FluentNone`.\n *\n * `MessageReference`, `VariantExpression`, `AttributeExpression` and\n * `SelectExpression` resolve to raw Runtime Entries objects and the result of\n * the resolution needs to be passed into `Type` to get their real value.\n * This is useful for composing expressions. Consider:\n *\n * brand-name[nominative]\n *\n * which is a `VariantExpression` with properties `id: MessageReference` and\n * `key: Keyword`. If `MessageReference` was resolved eagerly, it would\n * instantly resolve to the value of the `brand-name` message. Instead, we\n * want to get the message object and look for its `nominative` variant.\n *\n * All other expressions (except for `FunctionReference` which is only used in\n * `CallExpression`) resolve to an instance of `FluentType`. The caller should\n * use the `toString` method to convert the instance to a native value.\n *\n *\n * All functions in this file pass around a special object called `env`.\n * This object stores a set of elements used by all resolve functions:\n *\n * * {MessageContext} ctx\n * context for which the given resolution is happening\n * * {Object} args\n * list of developer provided arguments that can be used\n * * {Array} errors\n * list of errors collected while resolving\n * * {WeakSet} dirty\n * Set of patterns already encountered during this resolution.\n * This is used to prevent cyclic resolutions.\n */\n\n\nimport { FluentType, FluentNone, FluentNumber, FluentDateTime, FluentSymbol }\n from \"./types\";\nimport builtins from \"./builtins\";\n\n// Prevent expansion of too long placeables.\nconst MAX_PLACEABLE_LENGTH = 2500;\n\n// Unicode bidi isolation characters.\nconst FSI = \"\\u2068\";\nconst PDI = \"\\u2069\";\n\n\n/**\n * Helper for choosing the default value from a set of members.\n *\n * Used in SelectExpressions and Type.\n *\n * @param {Object} env\n * Resolver environment object.\n * @param {Object} members\n * Hash map of variants from which the default value is to be selected.\n * @param {Number} def\n * The index of the default variant.\n * @returns {FluentType}\n * @private\n */\nfunction DefaultMember(env, members, def) {\n if (members[def]) {\n return members[def];\n }\n\n const { errors } = env;\n errors.push(new RangeError(\"No default\"));\n return new FluentNone();\n}\n\n\n/**\n * Resolve a reference to another message.\n *\n * @param {Object} env\n * Resolver environment object.\n * @param {Object} id\n * The identifier of the message to be resolved.\n * @param {String} id.name\n * The name of the identifier.\n * @returns {FluentType}\n * @private\n */\nfunction MessageReference(env, {name}) {\n const { ctx, errors } = env;\n const message = name.startsWith(\"-\")\n ? ctx._terms.get(name)\n : ctx._messages.get(name);\n\n if (!message) {\n const err = name.startsWith(\"-\")\n ? new ReferenceError(`Unknown term: ${name}`)\n : new ReferenceError(`Unknown message: ${name}`);\n errors.push(err);\n return new FluentNone(name);\n }\n\n return message;\n}\n\n/**\n * Resolve a variant expression to the variant object.\n *\n * @param {Object} env\n * Resolver environment object.\n * @param {Object} expr\n * An expression to be resolved.\n * @param {Object} expr.id\n * An Identifier of a message for which the variant is resolved.\n * @param {Object} expr.id.name\n * Name a message for which the variant is resolved.\n * @param {Object} expr.key\n * Variant key to be resolved.\n * @returns {FluentType}\n * @private\n */\nfunction VariantExpression(env, {id, key}) {\n const message = MessageReference(env, id);\n if (message instanceof FluentNone) {\n return message;\n }\n\n const { ctx, errors } = env;\n const keyword = Type(env, key);\n\n function isVariantList(node) {\n return Array.isArray(node) &&\n node[0].type === \"sel\" &&\n node[0].exp === null;\n }\n\n if (isVariantList(message.val)) {\n // Match the specified key against keys of each variant, in order.\n for (const variant of message.val[0].vars) {\n const variantKey = Type(env, variant.key);\n if (keyword.match(ctx, variantKey)) {\n return variant;\n }\n }\n }\n\n errors.push(new ReferenceError(`Unknown variant: ${keyword.toString(ctx)}`));\n return Type(env, message);\n}\n\n\n/**\n * Resolve an attribute expression to the attribute object.\n *\n * @param {Object} env\n * Resolver environment object.\n * @param {Object} expr\n * An expression to be resolved.\n * @param {String} expr.id\n * An ID of a message for which the attribute is resolved.\n * @param {String} expr.name\n * Name of the attribute to be resolved.\n * @returns {FluentType}\n * @private\n */\nfunction AttributeExpression(env, {id, name}) {\n const message = MessageReference(env, id);\n if (message instanceof FluentNone) {\n return message;\n }\n\n if (message.attrs) {\n // Match the specified name against keys of each attribute.\n for (const attrName in message.attrs) {\n if (name === attrName) {\n return message.attrs[name];\n }\n }\n }\n\n const { errors } = env;\n errors.push(new ReferenceError(`Unknown attribute: ${name}`));\n return Type(env, message);\n}\n\n/**\n * Resolve a select expression to the member object.\n *\n * @param {Object} env\n * Resolver environment object.\n * @param {Object} expr\n * An expression to be resolved.\n * @param {String} expr.exp\n * Selector expression\n * @param {Array} expr.vars\n * List of variants for the select expression.\n * @param {Number} expr.def\n * Index of the default variant.\n * @returns {FluentType}\n * @private\n */\nfunction SelectExpression(env, {exp, vars, def}) {\n if (exp === null) {\n return DefaultMember(env, vars, def);\n }\n\n const selector = Type(env, exp);\n if (selector instanceof FluentNone) {\n return DefaultMember(env, vars, def);\n }\n\n // Match the selector against keys of each variant, in order.\n for (const variant of vars) {\n const key = Type(env, variant.key);\n const keyCanMatch =\n key instanceof FluentNumber || key instanceof FluentSymbol;\n\n if (!keyCanMatch) {\n continue;\n }\n\n const { ctx } = env;\n\n if (key.match(ctx, selector)) {\n return variant;\n }\n }\n\n return DefaultMember(env, vars, def);\n}\n\n\n/**\n * Resolve expression to a Fluent type.\n *\n * JavaScript strings are a special case. Since they natively have the\n * `toString` method they can be used as if they were a Fluent type without\n * paying the cost of creating a instance of one.\n *\n * @param {Object} env\n * Resolver environment object.\n * @param {Object} expr\n * An expression object to be resolved into a Fluent type.\n * @returns {FluentType}\n * @private\n */\nfunction Type(env, expr) {\n // A fast-path for strings which are the most common case, and for\n // `FluentNone` which doesn't require any additional logic.\n if (typeof expr === \"string\" || expr instanceof FluentNone) {\n return expr;\n }\n\n // The Runtime AST (Entries) encodes patterns (complex strings with\n // placeables) as Arrays.\n if (Array.isArray(expr)) {\n return Pattern(env, expr);\n }\n\n\n switch (expr.type) {\n case \"varname\":\n return new FluentSymbol(expr.name);\n case \"num\":\n return new FluentNumber(expr.val);\n case \"ext\":\n return ExternalArgument(env, expr);\n case \"fun\":\n return FunctionReference(env, expr);\n case \"call\":\n return CallExpression(env, expr);\n case \"ref\": {\n const message = MessageReference(env, expr);\n return Type(env, message);\n }\n case \"attr\": {\n const attr = AttributeExpression(env, expr);\n return Type(env, attr);\n }\n case \"var\": {\n const variant = VariantExpression(env, expr);\n return Type(env, variant);\n }\n case \"sel\": {\n const member = SelectExpression(env, expr);\n return Type(env, member);\n }\n case undefined: {\n // If it's a node with a value, resolve the value.\n if (expr.val !== null && expr.val !== undefined) {\n return Type(env, expr.val);\n }\n\n const { errors } = env;\n errors.push(new RangeError(\"No value\"));\n return new FluentNone();\n }\n default:\n return new FluentNone();\n }\n}\n\n/**\n * Resolve a reference to an external argument.\n *\n * @param {Object} env\n * Resolver environment object.\n * @param {Object} expr\n * An expression to be resolved.\n * @param {String} expr.name\n * Name of an argument to be returned.\n * @returns {FluentType}\n * @private\n */\nfunction ExternalArgument(env, {name}) {\n const { args, errors } = env;\n\n if (!args || !args.hasOwnProperty(name)) {\n errors.push(new ReferenceError(`Unknown external: ${name}`));\n return new FluentNone(name);\n }\n\n const arg = args[name];\n\n // Return early if the argument already is an instance of FluentType.\n if (arg instanceof FluentType) {\n return arg;\n }\n\n // Convert the argument to a Fluent type.\n switch (typeof arg) {\n case \"string\":\n return arg;\n case \"number\":\n return new FluentNumber(arg);\n case \"object\":\n if (arg instanceof Date) {\n return new FluentDateTime(arg);\n }\n default:\n errors.push(\n new TypeError(`Unsupported external type: ${name}, ${typeof arg}`)\n );\n return new FluentNone(name);\n }\n}\n\n/**\n * Resolve a reference to a function.\n *\n * @param {Object} env\n * Resolver environment object.\n * @param {Object} expr\n * An expression to be resolved.\n * @param {String} expr.name\n * Name of the function to be returned.\n * @returns {Function}\n * @private\n */\nfunction FunctionReference(env, {name}) {\n // Some functions are built-in. Others may be provided by the runtime via\n // the `MessageContext` constructor.\n const { ctx: { _functions }, errors } = env;\n const func = _functions[name] || builtins[name];\n\n if (!func) {\n errors.push(new ReferenceError(`Unknown function: ${name}()`));\n return new FluentNone(`${name}()`);\n }\n\n if (typeof func !== \"function\") {\n errors.push(new TypeError(`Function ${name}() is not callable`));\n return new FluentNone(`${name}()`);\n }\n\n return func;\n}\n\n/**\n * Resolve a call to a Function with positional and key-value arguments.\n *\n * @param {Object} env\n * Resolver environment object.\n * @param {Object} expr\n * An expression to be resolved.\n * @param {Object} expr.fun\n * FTL Function object.\n * @param {Array} expr.args\n * FTL Function argument list.\n * @returns {FluentType}\n * @private\n */\nfunction CallExpression(env, {fun, args}) {\n const callee = FunctionReference(env, fun);\n\n if (callee instanceof FluentNone) {\n return callee;\n }\n\n const posargs = [];\n const keyargs = {};\n\n for (const arg of args) {\n if (arg.type === \"narg\") {\n keyargs[arg.name] = Type(env, arg.val);\n } else {\n posargs.push(Type(env, arg));\n }\n }\n\n try {\n return callee(posargs, keyargs);\n } catch (e) {\n // XXX Report errors.\n return new FluentNone();\n }\n}\n\n/**\n * Resolve a pattern (a complex string with placeables).\n *\n * @param {Object} env\n * Resolver environment object.\n * @param {Array} ptn\n * Array of pattern elements.\n * @returns {Array}\n * @private\n */\nfunction Pattern(env, ptn) {\n const { ctx, dirty, errors } = env;\n\n if (dirty.has(ptn)) {\n errors.push(new RangeError(\"Cyclic reference\"));\n return new FluentNone();\n }\n\n // Tag the pattern as dirty for the purpose of the current resolution.\n dirty.add(ptn);\n const result = [];\n\n // Wrap interpolations with Directional Isolate Formatting characters\n // only when the pattern has more than one element.\n const useIsolating = ctx._useIsolating && ptn.length > 1;\n\n for (const elem of ptn) {\n if (typeof elem === \"string\") {\n result.push(elem);\n continue;\n }\n\n const part = Type(env, elem).toString(ctx);\n\n if (useIsolating) {\n result.push(FSI);\n }\n\n if (part.length > MAX_PLACEABLE_LENGTH) {\n errors.push(\n new RangeError(\n \"Too many characters in placeable \" +\n `(${part.length}, max allowed is ${MAX_PLACEABLE_LENGTH})`\n )\n );\n result.push(part.slice(MAX_PLACEABLE_LENGTH));\n } else {\n result.push(part);\n }\n\n if (useIsolating) {\n result.push(PDI);\n }\n }\n\n dirty.delete(ptn);\n return result.join(\"\");\n}\n\n/**\n * Format a translation into a string.\n *\n * @param {MessageContext} ctx\n * A MessageContext instance which will be used to resolve the\n * contextual information of the message.\n * @param {Object} args\n * List of arguments provided by the developer which can be accessed\n * from the message.\n * @param {Object} message\n * An object with the Message to be resolved.\n * @param {Array} errors\n * An error array that any encountered errors will be appended to.\n * @returns {FluentType}\n */\nexport default function resolve(ctx, args, message, errors = []) {\n const env = {\n ctx, args, errors, dirty: new WeakSet()\n };\n return Type(env, message).toString(ctx);\n}\n","import resolve from \"./resolver\";\nimport parse from \"./parser\";\n\n/**\n * Message contexts are single-language stores of translations. They are\n * responsible for parsing translation resources in the Fluent syntax and can\n * format translation units (entities) to strings.\n *\n * Always use `MessageContext.format` to retrieve translation units from\n * a context. Translations can contain references to other entities or\n * external arguments, conditional logic in form of select expressions, traits\n * which describe their grammatical features, and can use Fluent builtins which\n * make use of the `Intl` formatters to format numbers, dates, lists and more\n * into the context's language. See the documentation of the Fluent syntax for\n * more information.\n */\nexport class MessageContext {\n\n /**\n * Create an instance of `MessageContext`.\n *\n * The `locales` argument is used to instantiate `Intl` formatters used by\n * translations. The `options` object can be used to configure the context.\n *\n * Examples:\n *\n * const ctx = new MessageContext(locales);\n *\n * const ctx = new MessageContext(locales, { useIsolating: false });\n *\n * const ctx = new MessageContext(locales, {\n * useIsolating: true,\n * functions: {\n * NODE_ENV: () => process.env.NODE_ENV\n * }\n * });\n *\n * Available options:\n *\n * - `functions` - an object of additional functions available to\n * translations as builtins.\n *\n * - `useIsolating` - boolean specifying whether to use Unicode isolation\n * marks (FSI, PDI) for bidi interpolations.\n *\n * @param {string|Array} locales - Locale or locales of the context\n * @param {Object} [options]\n * @returns {MessageContext}\n */\n constructor(locales, { functions = {}, useIsolating = true } = {}) {\n this.locales = Array.isArray(locales) ? locales : [locales];\n\n this._terms = new Map();\n this._messages = new Map();\n this._functions = functions;\n this._useIsolating = useIsolating;\n this._intls = new WeakMap();\n }\n\n /*\n * Return an iterator over public `[id, message]` pairs.\n *\n * @returns {Iterator}\n */\n get messages() {\n return this._messages[Symbol.iterator]();\n }\n\n /*\n * Check if a message is present in the context.\n *\n * @param {string} id - The identifier of the message to check.\n * @returns {bool}\n */\n hasMessage(id) {\n return this._messages.has(id);\n }\n\n /*\n * Return the internal representation of a message.\n *\n * The internal representation should only be used as an argument to\n * `MessageContext.format`.\n *\n * @param {string} id - The identifier of the message to check.\n * @returns {Any}\n */\n getMessage(id) {\n return this._messages.get(id);\n }\n\n /**\n * Add a translation resource to the context.\n *\n * The translation resource must use the Fluent syntax. It will be parsed by\n * the context and each translation unit (message) will be available in the\n * context by its identifier.\n *\n * ctx.addMessages('foo = Foo');\n * ctx.getMessage('foo');\n *\n * // Returns a raw representation of the 'foo' message.\n *\n * Parsed entities should be formatted with the `format` method in case they\n * contain logic (references, select expressions etc.).\n *\n * @param {string} source - Text resource with translations.\n * @returns {Array}\n */\n addMessages(source) {\n const [entries, errors] = parse(source);\n for (const id in entries) {\n if (id.startsWith(\"-\")) {\n // Identifiers starting with a dash (-) define terms. Terms are private\n // and cannot be retrieved from MessageContext.\n if (this._terms.has(id)) {\n errors.push(`Attempt to override an existing term: \"${id}\"`);\n continue;\n }\n this._terms.set(id, entries[id]);\n } else {\n if (this._messages.has(id)) {\n errors.push(`Attempt to override an existing message: \"${id}\"`);\n continue;\n }\n this._messages.set(id, entries[id]);\n }\n }\n\n return errors;\n }\n\n /**\n * Format a message to a string or null.\n *\n * Format a raw `message` from the context into a string (or a null if it has\n * a null value). `args` will be used to resolve references to external\n * arguments inside of the translation.\n *\n * In case of errors `format` will try to salvage as much of the translation\n * as possible and will still return a string. For performance reasons, the\n * encountered errors are not returned but instead are appended to the\n * `errors` array passed as the third argument.\n *\n * const errors = [];\n * ctx.addMessages('hello = Hello, { $name }!');\n * const hello = ctx.getMessage('hello');\n * ctx.format(hello, { name: 'Jane' }, errors);\n *\n * // Returns 'Hello, Jane!' and `errors` is empty.\n *\n * ctx.format(hello, undefined, errors);\n *\n * // Returns 'Hello, name!' and `errors` is now:\n *\n * []\n *\n * @param {Object | string} message\n * @param {Object | undefined} args\n * @param {Array} errors\n * @returns {?string}\n */\n format(message, args, errors) {\n // optimize entities which are simple strings with no attributes\n if (typeof message === \"string\") {\n return message;\n }\n\n // optimize simple-string entities with attributes\n if (typeof message.val === \"string\") {\n return message.val;\n }\n\n // optimize entities with null values\n if (message.val === undefined) {\n return null;\n }\n\n return resolve(this, args, message, errors);\n }\n\n _memoizeIntlObject(ctor, opts) {\n const cache = this._intls.get(ctor) || {};\n const id = JSON.stringify(opts);\n\n if (!cache[id]) {\n cache[id] = new ctor(this.locales, opts);\n this._intls.set(ctor, cache);\n }\n\n return cache[id];\n }\n}\n","/*\n * CachedIterable caches the elements yielded by an iterable.\n *\n * It can be used to iterate over an iterable many times without depleting the\n * iterable.\n */\nexport default class CachedIterable {\n /**\n * Create an `CachedIterable` instance.\n *\n * @param {Iterable} iterable\n * @returns {CachedIterable}\n */\n constructor(iterable) {\n if (Symbol.asyncIterator in Object(iterable)) {\n this.iterator = iterable[Symbol.asyncIterator]();\n } else if (Symbol.iterator in Object(iterable)) {\n this.iterator = iterable[Symbol.iterator]();\n } else {\n throw new TypeError(\"Argument must implement the iteration protocol.\");\n }\n\n this.seen = [];\n }\n\n [Symbol.iterator]() {\n const { seen, iterator } = this;\n let cur = 0;\n\n return {\n next() {\n if (seen.length <= cur) {\n seen.push(iterator.next());\n }\n return seen[cur++];\n }\n };\n }\n\n [Symbol.asyncIterator]() {\n const { seen, iterator } = this;\n let cur = 0;\n\n return {\n async next() {\n if (seen.length <= cur) {\n seen.push(await iterator.next());\n }\n return seen[cur++];\n }\n };\n }\n\n /**\n * This method allows user to consume the next element from the iterator\n * into the cache.\n */\n touchNext() {\n const { seen, iterator } = this;\n if (seen.length === 0 || seen[seen.length - 1].done === false) {\n seen.push(iterator.next());\n }\n }\n}\n","/*\n * @overview\n *\n * Functions for managing ordered sequences of MessageContexts.\n *\n * An ordered iterable of MessageContext instances can represent the current\n * negotiated fallback chain of languages. This iterable can be used to find\n * the best existing translation for a given identifier.\n *\n * The mapContext* methods can be used to find the first MessageContext in the\n * given iterable which contains the translation with the given identifier. If\n * the iterable is ordered according to the result of a language negotiation\n * the returned MessageContext contains the best available translation.\n *\n * A simple function which formats translations based on the identifier might\n * be implemented as follows:\n *\n * formatString(id, args) {\n * const ctx = mapContextSync(contexts, id);\n *\n * if (ctx === null) {\n * return id;\n * }\n *\n * const msg = ctx.getMessage(id);\n * return ctx.format(msg, args);\n * }\n *\n * In order to pass an iterator to mapContext*, wrap it in CachedIterable.\n * This allows multiple calls to mapContext* without advancing and eventually\n * depleting the iterator.\n *\n * function *generateMessages() {\n * // Some lazy logic for yielding MessageContexts.\n * yield *[ctx1, ctx2];\n * }\n *\n * const contexts = new CachedIterable(generateMessages());\n * const ctx = mapContextSync(contexts, id);\n *\n */\n\n/*\n * Synchronously map an identifier or an array of identifiers to the best\n * `MessageContext` instance(s).\n *\n * @param {Iterable} iterable\n * @param {string|Array} ids\n * @returns {MessageContext|Array}\n */\nexport function mapContextSync(iterable, ids) {\n if (!Array.isArray(ids)) {\n return getContextForId(iterable, ids);\n }\n\n return ids.map(\n id => getContextForId(iterable, id)\n );\n}\n\n/*\n * Find the best `MessageContext` with the translation for `id`.\n */\nfunction getContextForId(iterable, id) {\n for (const context of iterable) {\n if (context.hasMessage(id)) {\n return context;\n }\n }\n\n return null;\n}\n\n/*\n * Asynchronously map an identifier or an array of identifiers to the best\n * `MessageContext` instance(s).\n *\n * @param {AsyncIterable} iterable\n * @param {string|Array} ids\n * @returns {Promise>}\n */\nexport async function mapContextAsync(iterable, ids) {\n if (!Array.isArray(ids)) {\n for await (const context of iterable) {\n if (context.hasMessage(ids)) {\n return context;\n }\n }\n }\n\n let remainingCount = ids.length;\n const foundContexts = new Array(remainingCount).fill(null);\n\n for await (const context of iterable) {\n // XXX Switch to const [index, id] of id.entries() when we move to Babel 7.\n // See https://github.com/babel/babel/issues/5880.\n for (let index = 0; index < ids.length; index++) {\n const id = ids[index];\n if (!foundContexts[index] && context.hasMessage(id)) {\n foundContexts[index] = context;\n remainingCount--;\n }\n\n // Return early when all ids have been mapped to contexts.\n if (remainingCount === 0) {\n return foundContexts;\n }\n }\n }\n\n return foundContexts;\n}\n","function nonBlank(line) {\n return !/^\\s*$/.test(line);\n}\n\nfunction countIndent(line) {\n const [indent] = line.match(/^\\s*/);\n return indent.length;\n}\n\n/**\n * Template literal tag for dedenting FTL code.\n *\n * Strip the common indent of non-blank lines. Remove blank lines.\n *\n * @param {Array} strings\n */\nexport function ftl(strings) {\n const [code] = strings;\n const lines = code.split(\"\\n\").filter(nonBlank);\n const indents = lines.map(countIndent);\n const common = Math.min(...indents);\n const indent = new RegExp(`^\\\\s{${common}}`);\n\n return lines.map(\n line => line.replace(indent, \"\")\n ).join(\"\\n\");\n}\n","/*\n * @module fluent\n * @overview\n *\n * `fluent` is a JavaScript implementation of Project Fluent, a localization\n * framework designed to unleash the expressive power of the natural language.\n *\n */\n\nexport { default as _parse } from \"./parser\";\n\nexport { MessageContext } from \"./context\";\nexport {\n FluentType as MessageArgument,\n FluentNumber as MessageNumberArgument,\n FluentDateTime as MessageDateTimeArgument,\n} from \"./types\";\n\nexport { default as CachedIterable } from \"./cached_iterable\";\nexport { mapContextSync, mapContextAsync } from \"./fallback\";\n\nexport { ftl } from \"./util\";\n","import { CachedIterable, mapContextSync } from \"fluent\";\n\n/*\n * `ReactLocalization` handles translation formatting and fallback.\n *\n * The current negotiated fallback chain of languages is stored in the\n * `ReactLocalization` instance in form of an iterable of `MessageContext`\n * instances. This iterable is used to find the best existing translation for\n * a given identifier.\n *\n * `Localized` components must subscribe to the changes of the\n * `ReactLocalization`'s fallback chain. When the fallback chain changes (the\n * `messages` iterable is set anew), all subscribed compontent must relocalize.\n *\n * The `ReactLocalization` class instances are exposed to `Localized` elements\n * via the `LocalizationProvider` component.\n */\nexport default class ReactLocalization {\n constructor(messages) {\n this.contexts = new CachedIterable(messages);\n this.subs = new Set();\n }\n\n /*\n * Subscribe a `Localized` component to changes of `messages`.\n */\n subscribe(comp) {\n this.subs.add(comp);\n }\n\n /*\n * Unsubscribe a `Localized` component from `messages` changes.\n */\n unsubscribe(comp) {\n this.subs.delete(comp);\n }\n\n /*\n * Set a new `messages` iterable and trigger the retranslation.\n */\n setMessages(messages) {\n this.contexts = new CachedIterable(messages);\n\n // Update all subscribed Localized components.\n this.subs.forEach(comp => comp.relocalize());\n }\n\n getMessageContext(id) {\n return mapContextSync(this.contexts, id);\n }\n\n formatCompound(mcx, msg, args) {\n const value = mcx.format(msg, args);\n\n if (msg.attrs) {\n var attrs = {};\n for (const name of Object.keys(msg.attrs)) {\n attrs[name] = mcx.format(msg.attrs[name], args);\n }\n }\n\n return { value, attrs };\n }\n\n /*\n * Find a translation by `id` and format it to a string using `args`.\n */\n getString(id, args, fallback) {\n const mcx = this.getMessageContext(id);\n\n if (mcx === null) {\n return fallback || id;\n }\n\n const msg = mcx.getMessage(id);\n return mcx.format(msg, args);\n }\n}\n\nexport function isReactLocalization(props, propName) {\n const prop = props[propName];\n\n if (prop instanceof ReactLocalization) {\n return null;\n }\n\n return new Error(\n `The ${propName} context field must be an instance of ReactLocalization.`\n );\n}\n","import { Component, Children } from \"react\";\nimport PropTypes from \"prop-types\";\n\nimport ReactLocalization, { isReactLocalization} from \"./localization\";\n\n/*\n * The Provider component for the `ReactLocalization` class.\n *\n * Exposes a `ReactLocalization` instance to all descendants via React's\n * context feature. It makes translations available to all localizable\n * elements in the descendant's render tree without the need to pass them\n * explicitly.\n *\n * \n * …\n * \n *\n * The `LocalizationProvider` component takes one prop: `messages`. It should\n * be an iterable of `MessageContext` instances in order of the user's\n * preferred languages. The `MessageContext` instances will be used by\n * `ReactLocalization` to format translations. If a translation is missing in\n * one instance, `ReactLocalization` will fall back to the next one.\n */\nexport default class LocalizationProvider extends Component {\n constructor(props) {\n super(props);\n const { messages } = props;\n\n if (messages === undefined) {\n throw new Error(\"LocalizationProvider must receive the messages prop.\");\n }\n\n if (!messages[Symbol.iterator]) {\n throw new Error(\"The messages prop must be an iterable.\");\n }\n\n this.l10n = new ReactLocalization(messages);\n }\n\n getChildContext() {\n return {\n l10n: this.l10n\n };\n }\n\n componentWillReceiveProps(next) {\n const { messages } = next;\n\n if (messages !== this.props.messages) {\n this.l10n.setMessages(messages);\n }\n }\n\n render() {\n return Children.only(this.props.children);\n }\n}\n\nLocalizationProvider.childContextTypes = {\n l10n: isReactLocalization\n};\n\nLocalizationProvider.propTypes = {\n children: PropTypes.element.isRequired,\n messages: isIterable\n};\n\nfunction isIterable(props, propName, componentName) {\n const prop = props[propName];\n\n if (Symbol.iterator in Object(prop)) {\n return null;\n }\n\n return new Error(\n `The ${propName} prop supplied to ${componentName} must be an iterable.`\n );\n}\n","import { createElement, Component } from \"react\";\n\nimport { isReactLocalization } from \"./localization\";\n\nexport default function withLocalization(Inner) {\n class WithLocalization extends Component {\n componentDidMount() {\n const { l10n } = this.context;\n\n if (l10n) {\n l10n.subscribe(this);\n }\n }\n\n componentWillUnmount() {\n const { l10n } = this.context;\n\n if (l10n) {\n l10n.unsubscribe(this);\n }\n }\n\n /*\n * Rerender this component in a new language.\n */\n relocalize() {\n // When the `ReactLocalization`'s fallback chain changes, update the\n // component.\n this.forceUpdate();\n }\n\n /*\n * Find a translation by `id` and format it to a string using `args`.\n */\n getString(id, args, fallback) {\n const { l10n } = this.context;\n\n if (!l10n) {\n return fallback || id;\n }\n\n return l10n.getString(id, args, fallback);\n }\n\n render() {\n return createElement(\n Inner,\n Object.assign(\n // getString needs to be re-bound on updates to trigger a re-render\n { getString: (...args) => this.getString(...args) },\n this.props\n )\n );\n }\n }\n\n WithLocalization.displayName = `WithLocalization(${displayName(Inner)})`;\n\n WithLocalization.contextTypes = {\n l10n: isReactLocalization\n };\n\n return WithLocalization;\n}\n\nfunction displayName(component) {\n return component.displayName || component.name || \"Component\";\n}\n","/* eslint-env browser */\n\nconst TEMPLATE = document.createElement(\"template\");\n\nexport function parseMarkup(str) {\n TEMPLATE.innerHTML = str;\n return TEMPLATE.content;\n}\n","/**\n * Copyright (c) 2013-present, Facebook, Inc.\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in this directory.\n */\n\n// For HTML, certain tags should omit their close tag. We keep a whitelist for\n// those special-case tags.\n\nvar omittedCloseTags = {\n area: true,\n base: true,\n br: true,\n col: true,\n embed: true,\n hr: true,\n img: true,\n input: true,\n keygen: true,\n link: true,\n meta: true,\n param: true,\n source: true,\n track: true,\n wbr: true,\n // NOTE: menuitem's close tag should be omitted, but that causes problems.\n};\n\nexport default omittedCloseTags;\n","/**\n * Copyright (c) 2013-present, Facebook, Inc.\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in this directory.\n */\n\nimport omittedCloseTags from './omittedCloseTags';\n\n// For HTML, certain tags cannot have children. This has the same purpose as\n// `omittedCloseTags` except that `menuitem` should still have its closing tag.\n\nvar voidElementTags = {\n menuitem: true,\n ...omittedCloseTags,\n};\n\nexport default voidElementTags;\n","import { isValidElement, cloneElement, Component, Children } from \"react\";\nimport PropTypes from \"prop-types\";\n\nimport { isReactLocalization } from \"./localization\";\nimport { parseMarkup } from \"./markup\";\nimport VOID_ELEMENTS from \"../vendor/voidElementTags\";\n\n// Match the opening angle bracket (<) in HTML tags, and HTML entities like\n// &, &, &.\nconst reMarkup = /<|&#?\\w+;/;\n\n/*\n * Prepare props passed to `Localized` for formatting.\n */\nfunction toArguments(props) {\n const args = {};\n const elems = {};\n\n for (const [propname, propval] of Object.entries(props)) {\n if (propname.startsWith(\"$\")) {\n const name = propname.substr(1);\n args[name] = propval;\n } else if (isValidElement(propval)) {\n // We'll try to match localNames of elements found in the translation with\n // names of elements passed as props. localNames are always lowercase.\n const name = propname.toLowerCase();\n elems[name] = propval;\n }\n }\n\n return [args, elems];\n}\n\n/*\n * The `Localized` class renders its child with translated props and children.\n *\n * \n *

    {'Hello, world!'}

    \n *     \n *\n * The `id` prop should be the unique identifier of the translation. Any\n * attributes found in the translation will be applied to the wrapped element.\n *\n * Arguments to the translation can be passed as `$`-prefixed props on\n * `Localized`.\n *\n * \n *

    {'Hello, { $username }!'}

    \n *     \n *\n * It's recommended that the contents of the wrapped component be a string\n * expression. The string will be used as the ultimate fallback if no\n * translation is available. It also makes it easy to grep for strings in the\n * source code.\n */\nexport default class Localized extends Component {\n componentDidMount() {\n const { l10n } = this.context;\n\n if (l10n) {\n l10n.subscribe(this);\n }\n }\n\n componentWillUnmount() {\n const { l10n } = this.context;\n\n if (l10n) {\n l10n.unsubscribe(this);\n }\n }\n\n /*\n * Rerender this component in a new language.\n */\n relocalize() {\n // When the `ReactLocalization`'s fallback chain changes, update the\n // component.\n this.forceUpdate();\n }\n\n render() {\n const { l10n } = this.context;\n const { id, attrs, children } = this.props;\n const elem = Children.only(children);\n\n if (!l10n) {\n // Use the wrapped component as fallback.\n return elem;\n }\n\n const mcx = l10n.getMessageContext(id);\n\n if (mcx === null) {\n // Use the wrapped component as fallback.\n return elem;\n }\n\n const msg = mcx.getMessage(id);\n const [args, elems] = toArguments(this.props);\n const {\n value: messageValue,\n attrs: messageAttrs\n } = l10n.formatCompound(mcx, msg, args);\n\n // The default is to forbid all message attributes. If the attrs prop exists\n // on the Localized instance, only set message attributes which have been\n // explicitly allowed by the developer.\n if (attrs && messageAttrs) {\n var localizedProps = {};\n\n for (const [name, value] of Object.entries(messageAttrs)) {\n if (attrs[name]) {\n localizedProps[name] = value;\n }\n }\n }\n\n // If the wrapped component is a known void element, explicitly dismiss the\n // message value and do not pass it to cloneElement in order to avoid the\n // \"void element tags must neither have `children` nor use\n // `dangerouslySetInnerHTML`\" error.\n if (elem.type in VOID_ELEMENTS) {\n return cloneElement(elem, localizedProps);\n }\n\n // If the message has a null value, we're only interested in its attributes.\n // Do not pass the null value to cloneElement as it would nuke all children\n // of the wrapped component.\n if (messageValue === null) {\n return cloneElement(elem, localizedProps);\n }\n\n // If the message value doesn't contain any markup nor any HTML entities,\n // insert it as the only child of the wrapped component.\n if (!reMarkup.test(messageValue)) {\n return cloneElement(elem, localizedProps, messageValue);\n }\n\n // If the message contains markup, parse it and try to match the children\n // found in the translation with the props passed to this Localized.\n const translationNodes = Array.from(parseMarkup(messageValue).childNodes);\n const translatedChildren = translationNodes.map(childNode => {\n if (childNode.nodeType === childNode.TEXT_NODE) {\n return childNode.textContent;\n }\n\n // If the child is not expected just take its textContent.\n if (!elems.hasOwnProperty(childNode.localName)) {\n return childNode.textContent;\n }\n\n const sourceChild = elems[childNode.localName];\n\n // If the element passed as a prop to is a known void element,\n // explicitly dismiss any textContent which might have accidentally been\n // defined in the translation to prevent the \"void element tags must not\n // have children\" error.\n if (sourceChild.type in VOID_ELEMENTS) {\n return sourceChild;\n }\n\n // TODO Protect contents of elements wrapped in \n // https://github.com/projectfluent/fluent.js/issues/184\n // TODO Control localizable attributes on elements passed as props\n // https://github.com/projectfluent/fluent.js/issues/185\n return cloneElement(sourceChild, null, childNode.textContent);\n });\n\n return cloneElement(elem, localizedProps, ...translatedChildren);\n }\n}\n\nLocalized.contextTypes = {\n l10n: isReactLocalization\n};\n\nLocalized.propTypes = {\n children: PropTypes.element.isRequired,\n};\n","/*\n * @module fluent-react\n * @overview\n *\n\n * `fluent-react` provides React bindings for Fluent. It takes advantage of\n * React's Components system and the virtual DOM. Translations are exposed to\n * components via the provider pattern.\n *\n * \n * \n *

    {'Hello, world!'}

    \n *     \n *     \n *\n * Consult the documentation of the `LocalizationProvider` and the `Localized`\n * components for more information.\n */\n\nexport { default as LocalizationProvider } from \"./provider\";\nexport { default as withLocalization } from \"./with_localization\";\nexport { default as Localized } from \"./localized\";\nexport { default as ReactLocalization, isReactLocalization }\n from \"./localization\";\n","import React from \"react\";\nimport {safeURI} from \"../../template-utils\";\n\nconst ALLOWED_STYLE_TAGS = [\"color\", \"backgroundColor\"];\n\nexport const Button = props => {\n const style = {};\n\n // Add allowed style tags from props, e.g. props.color becomes style={color: props.color}\n for (const tag of ALLOWED_STYLE_TAGS) {\n if (typeof props[tag] !== \"undefined\") {\n style[tag] = props[tag];\n }\n }\n // remove border if bg is set to something custom\n if (style.backgroundColor) {\n style.border = \"0\";\n }\n\n return (\n {props.children}\n );\n};\n","import React from \"react\";\n\nexport class SnippetBase extends React.PureComponent {\n constructor(props) {\n super(props);\n this.onBlockClicked = this.onBlockClicked.bind(this);\n }\n\n onBlockClicked() {\n this.props.sendUserActionTelemetry({event: \"BLOCK\", id: this.props.UISurface});\n this.props.onBlock();\n }\n\n render() {\n const {props} = this;\n\n const containerClassName = `SnippetBaseContainer${props.className ? ` ${props.className}` : \"\"}`;\n\n return (
    \n
    \n {props.children}\n
    \n
    );\n }\n}\n","import {Button} from \"../../components/Button/Button\";\nimport React from \"react\";\nimport {safeURI} from \"../../template-utils\";\nimport {SnippetBase} from \"../../components/SnippetBase/SnippetBase\";\n\nconst DEFAULT_ICON_PATH = \"chrome://branding/content/icon64.png\";\n\nexport class SimpleSnippet extends React.PureComponent {\n constructor(props) {\n super(props);\n this.onButtonClick = this.onButtonClick.bind(this);\n }\n\n onButtonClick() {\n this.props.sendUserActionTelemetry({event: \"CLICK_BUTTON\", id: this.props.UISurface});\n }\n\n renderTitle() {\n const {title} = this.props.content;\n return title ?

    {title}

    : null;\n }\n\n renderTitleIcon() {\n const titleIcon = safeURI(this.props.content.title_icon);\n return titleIcon ? : null;\n }\n\n renderButton(className) {\n const {props} = this;\n return (\n {props.content.button_label}\n );\n }\n\n render() {\n const {props} = this;\n const hasLink = props.content.button_url && props.content.button_type === \"anchor\";\n const hasButton = props.content.button_url && !props.content.button_type;\n const className = `SimpleSnippet${props.content.tall ? \" tall\" : \"\"}`;\n return (\n \n
    \n {this.renderTitleIcon()} {this.renderTitle()}

    {props.richText || props.content.text}

    {hasLink ? this.renderButton(\"ASRouterAnchor\") : null}\n
    \n {hasButton ?
    {this.renderButton()}
    : null}\n     );\n }\n}\n","this.Dedupe = class Dedupe {\n constructor(createKey) {\n this.createKey = createKey || this.defaultCreateKey;\n }\n\n defaultCreateKey(item) {\n return item;\n }\n\n /**\n * Dedupe any number of grouped elements favoring those from earlier groups.\n *\n * @param {Array} groups Contains an arbitrary number of arrays of elements.\n * @returns {Array} A matching array of each provided group deduped.\n */\n group(...groups) {\n const globalKeys = new Set();\n const result = [];\n for (const values of groups) {\n const valueMap = new Map();\n for (const value of values) {\n const key = this.createKey(value);\n if (!globalKeys.has(key) && !valueMap.has(key)) {\n valueMap.set(key, value);\n }\n }\n result.push(valueMap);\n valueMap.forEach((value, key) => globalKeys.add(key));\n }\n return result.map(m => Array.from(m.values()));\n }\n};\n\nconst EXPORTED_SYMBOLS = [\"Dedupe\"];\n","/* This Source Code Form is subject to the terms of the Mozilla Public\n * License, v. 2.0. If a copy of the MPL was not distributed with this\n * file, You can obtain one at http://mozilla.org/MPL/2.0/. */\n\"use strict\";\n\nconst {actionTypes: at} = ChromeUtils.import(\"resource://activity-stream/common/Actions.jsm\", {});\nconst {Dedupe} = ChromeUtils.import(\"resource://activity-stream/common/Dedupe.jsm\", {});\n\nconst TOP_SITES_DEFAULT_ROWS = 1;\nconst TOP_SITES_MAX_SITES_PER_ROW = 8;\n\nconst dedupe = new Dedupe(site => site && site.url);\n\nconst INITIAL_STATE = {\n App: {\n // Have we received real data from the app yet?\n initialized: false,\n // The version of the system-addon\n version: null\n },\n Snippets: {initialized: false},\n TopSites: {\n // Have we received real data from history yet?\n initialized: false,\n // The history (and possibly default) links\n rows: [],\n // Used in content only to dispatch action to TopSiteForm.\n editForm: null\n },\n Prefs: {\n initialized: false,\n values: {}\n },\n Dialog: {\n visible: false,\n data: {}\n },\n Sections: []\n};\n\nfunction App(prevState = INITIAL_STATE.App, action) {\n switch (action.type) {\n case at.INIT:\n return Object.assign({}, prevState, action.data || {}, {initialized: true});\n default:\n return prevState;\n }\n}\n\n/**\n * insertPinned - Inserts pinned links in their specified slots\n *\n * @param {array} a list of links\n * @param {array} a list of pinned links\n * @return {array} resulting list of links with pinned links inserted\n */\nfunction insertPinned(links, pinned) {\n // Remove any pinned links\n const pinnedUrls = pinned.map(link => link && link.url);\n let newLinks = links.filter(link => (link ? !pinnedUrls.includes(link.url) : false));\n newLinks = newLinks.map(link => {\n if (link && link.isPinned) {\n delete link.isPinned;\n delete link.pinIndex;\n }\n return link;\n });\n\n // Then insert them in their specified location\n pinned.forEach((val, index) => {\n if (!val) { return; }\n let link = Object.assign({}, val, {isPinned: true, pinIndex: index});\n if (index > newLinks.length) {\n newLinks[index] = link;\n } else {\n newLinks.splice(index, 0, link);\n }\n });\n\n return newLinks;\n}\n\nfunction TopSites(prevState = INITIAL_STATE.TopSites, action) {\n let hasMatch;\n let newRows;\n switch (action.type) {\n case at.TOP_SITES_UPDATED:\n if (!action.data || !action.data.links) {\n return prevState;\n }\n return Object.assign({}, prevState, {initialized: true, rows: action.data.links}, action.data.pref ? {pref: action.data.pref} : {});\n case at.TOP_SITES_PREFS_UPDATED:\n return Object.assign({}, prevState, {pref: action.data.pref});\n case at.TOP_SITES_EDIT:\n return Object.assign({}, prevState, {\n editForm: {\n index: action.data.index,\n previewResponse: null\n }\n });\n case at.TOP_SITES_CANCEL_EDIT:\n return Object.assign({}, prevState, {editForm: null});\n case at.PREVIEW_RESPONSE:\n if (!prevState.editForm || action.data.url !== prevState.editForm.previewUrl) {\n return prevState;\n }\n return Object.assign({}, prevState, {\n editForm: {\n index: prevState.editForm.index,\n previewResponse: action.data.preview,\n previewUrl: action.data.url\n }\n });\n case at.PREVIEW_REQUEST:\n if (!prevState.editForm) {\n return prevState;\n }\n return Object.assign({}, prevState, {\n editForm: {\n index: prevState.editForm.index,\n previewResponse: null,\n previewUrl: action.data.url\n }\n });\n case at.PREVIEW_REQUEST_CANCEL:\n if (!prevState.editForm) {\n return prevState;\n }\n return Object.assign({}, prevState, {\n editForm: {\n index: prevState.editForm.index,\n previewResponse: null\n }\n });\n case at.SCREENSHOT_UPDATED:\n newRows = prevState.rows.map(row => {\n if (row && row.url === action.data.url) {\n hasMatch = true;\n return Object.assign({}, row, {screenshot: action.data.screenshot});\n }\n return row;\n });\n return hasMatch ? Object.assign({}, prevState, {rows: newRows}) : prevState;\n case at.PLACES_BOOKMARK_ADDED:\n if (!action.data) {\n return prevState;\n }\n newRows = prevState.rows.map(site => {\n if (site && site.url === action.data.url) {\n const {bookmarkGuid, bookmarkTitle, dateAdded} = action.data;\n return Object.assign({}, site, {bookmarkGuid, bookmarkTitle, bookmarkDateCreated: dateAdded});\n }\n return site;\n });\n return Object.assign({}, prevState, {rows: newRows});\n case at.PLACES_BOOKMARK_REMOVED:\n if (!action.data) {\n return prevState;\n }\n newRows = prevState.rows.map(site => {\n if (site && site.url === action.data.url) {\n const newSite = Object.assign({}, site);\n delete newSite.bookmarkGuid;\n delete newSite.bookmarkTitle;\n delete newSite.bookmarkDateCreated;\n return newSite;\n }\n return site;\n });\n return Object.assign({}, prevState, {rows: newRows});\n case at.PLACES_LINK_DELETED:\n if (!action.data) {\n return prevState;\n }\n newRows = prevState.rows.filter(site => action.data.url !== site.url);\n return Object.assign({}, prevState, {rows: newRows});\n default:\n return prevState;\n }\n}\n\nfunction Dialog(prevState = INITIAL_STATE.Dialog, action) {\n switch (action.type) {\n case at.DIALOG_OPEN:\n return Object.assign({}, prevState, {visible: true, data: action.data});\n case at.DIALOG_CANCEL:\n return Object.assign({}, prevState, {visible: false});\n case at.DELETE_HISTORY_URL:\n return Object.assign({}, INITIAL_STATE.Dialog);\n default:\n return prevState;\n }\n}\n\nfunction Prefs(prevState = INITIAL_STATE.Prefs, action) {\n let newValues;\n switch (action.type) {\n case at.PREFS_INITIAL_VALUES:\n return Object.assign({}, prevState, {initialized: true, values: action.data});\n case at.PREF_CHANGED:\n newValues = Object.assign({}, prevState.values);\n newValues[action.data.name] = action.data.value;\n return Object.assign({}, prevState, {values: newValues});\n default:\n return prevState;\n }\n}\n\nfunction Sections(prevState = INITIAL_STATE.Sections, action) {\n let hasMatch;\n let newState;\n switch (action.type) {\n case at.SECTION_DEREGISTER:\n return prevState.filter(section => section.id !== action.data);\n case at.SECTION_REGISTER:\n // If section exists in prevState, update it\n newState = prevState.map(section => {\n if (section && section.id === action.data.id) {\n hasMatch = true;\n return Object.assign({}, section, action.data);\n }\n return section;\n });\n // Otherwise, append it\n if (!hasMatch) {\n const initialized = !!(action.data.rows && action.data.rows.length > 0);\n const section = Object.assign({title: \"\", rows: [], enabled: false}, action.data, {initialized});\n newState.push(section);\n }\n return newState;\n case at.SECTION_UPDATE:\n newState = prevState.map(section => {\n if (section && section.id === action.data.id) {\n // If the action is updating rows, we should consider initialized to be true.\n // This can be overridden if initialized is defined in the action.data\n const initialized = action.data.rows ? {initialized: true} : {};\n\n // Make sure pinned cards stay at their current position when rows are updated.\n // Disabling a section (SECTION_UPDATE with empty rows) does not retain pinned cards.\n if (action.data.rows && action.data.rows.length > 0 && section.rows.find(card => card.pinned)) {\n const rows = Array.from(action.data.rows);\n section.rows.forEach((card, index) => {\n if (card.pinned) {\n rows.splice(index, 0, card);\n }\n });\n return Object.assign({}, section, initialized, Object.assign({}, action.data, {rows}));\n }\n\n return Object.assign({}, section, initialized, action.data);\n }\n return section;\n });\n\n if (!action.data.dedupeConfigurations) {\n return newState;\n }\n\n action.data.dedupeConfigurations.forEach(dedupeConf => {\n newState = newState.map(section => {\n if (section.id === dedupeConf.id) {\n const dedupedRows = dedupeConf.dedupeFrom.reduce((rows, dedupeSectionId) => {\n const dedupeSection = newState.find(s => s.id === dedupeSectionId);\n const [, newRows] = dedupe.group(dedupeSection.rows, rows);\n return newRows;\n }, section.rows);\n\n return Object.assign({}, section, {rows: dedupedRows});\n }\n\n return section;\n });\n });\n\n return newState;\n case at.SECTION_UPDATE_CARD:\n return prevState.map(section => {\n if (section && section.id === action.data.id && section.rows) {\n const newRows = section.rows.map(card => {\n if (card.url === action.data.url) {\n return Object.assign({}, card, action.data.options);\n }\n return card;\n });\n return Object.assign({}, section, {rows: newRows});\n }\n return section;\n });\n case at.PLACES_BOOKMARK_ADDED:\n if (!action.data) {\n return prevState;\n }\n return prevState.map(section => Object.assign({}, section, {\n rows: section.rows.map(item => {\n // find the item within the rows that is attempted to be bookmarked\n if (item.url === action.data.url) {\n const {bookmarkGuid, bookmarkTitle, dateAdded} = action.data;\n return Object.assign({}, item, {\n bookmarkGuid,\n bookmarkTitle,\n bookmarkDateCreated: dateAdded,\n type: \"bookmark\"\n });\n }\n return item;\n })\n }));\n case at.PLACES_SAVED_TO_POCKET:\n if (!action.data) {\n return prevState;\n }\n return prevState.map(section => Object.assign({}, section, {\n rows: section.rows.map(item => {\n if (item.url === action.data.url) {\n return Object.assign({}, item, {\n open_url: action.data.open_url,\n pocket_id: action.data.pocket_id,\n title: action.data.title,\n type: \"pocket\"\n });\n }\n return item;\n })\n }));\n case at.PLACES_BOOKMARK_REMOVED:\n if (!action.data) {\n return prevState;\n }\n return prevState.map(section => Object.assign({}, section, {\n rows: section.rows.map(item => {\n // find the bookmark within the rows that is attempted to be removed\n if (item.url === action.data.url) {\n const newSite = Object.assign({}, item);\n delete newSite.bookmarkGuid;\n delete newSite.bookmarkTitle;\n delete newSite.bookmarkDateCreated;\n if (!newSite.type || newSite.type === \"bookmark\") {\n newSite.type = \"history\";\n }\n return newSite;\n }\n return item;\n })\n }));\n case at.PLACES_LINK_DELETED:\n case at.PLACES_LINK_BLOCKED:\n if (!action.data) {\n return prevState;\n }\n return prevState.map(section =>\n Object.assign({}, section, {rows: section.rows.filter(site => site.url !== action.data.url)}));\n case at.DELETE_FROM_POCKET:\n case at.ARCHIVE_FROM_POCKET:\n return prevState.map(section =>\n Object.assign({}, section, {rows: section.rows.filter(site => site.pocket_id !== action.data.pocket_id)}));\n default:\n return prevState;\n }\n}\n\nfunction Snippets(prevState = INITIAL_STATE.Snippets, action) {\n switch (action.type) {\n case at.SNIPPETS_DATA:\n return Object.assign({}, prevState, {initialized: true}, action.data);\n case at.SNIPPET_BLOCKED:\n return Object.assign({}, prevState, {blockList: prevState.blockList.concat(action.data)});\n case at.SNIPPETS_BLOCKLIST_CLEARED:\n return Object.assign({}, prevState, {blockList: []});\n case at.SNIPPETS_RESET:\n return INITIAL_STATE.Snippets;\n default:\n return prevState;\n }\n}\n\nthis.INITIAL_STATE = INITIAL_STATE;\nthis.TOP_SITES_DEFAULT_ROWS = TOP_SITES_DEFAULT_ROWS;\nthis.TOP_SITES_MAX_SITES_PER_ROW = TOP_SITES_MAX_SITES_PER_ROW;\n\nthis.reducers = {TopSites, App, Snippets, Prefs, Dialog, Sections};\n\nconst EXPORTED_SYMBOLS = [\"reducers\", \"INITIAL_STATE\", \"insertPinned\", \"TOP_SITES_DEFAULT_ROWS\", \"TOP_SITES_MAX_SITES_PER_ROW\"];\n","import React from \"react\";\n\nexport class ModalOverlay extends React.PureComponent {\n componentWillMount() {\n this.setState({active: true});\n document.body.classList.add(\"modal-open\");\n }\n\n componentWillUnmount() {\n document.body.classList.remove(\"modal-open\");\n this.setState({active: false});\n }\n\n render() {\n const {active} = this.state;\n const {title, button_label} = this.props;\n return (\n
    \n
    \n
    \n

    {title}

    \n {this.props.children}\n
    \n \n
    \n
    \n
    \n );\n }\n}\n","import {ModalOverlay} from \"../../components/ModalOverlay/ModalOverlay\";\nimport React from \"react\";\n\nclass OnboardingCard extends React.PureComponent {\n constructor(props) {\n super(props);\n this.onClick = this.onClick.bind(this);\n }\n\n onClick() {\n const {props} = this;\n props.sendUserActionTelemetry({event: \"CLICK_BUTTON\", message_id: props.id, id: props.UISurface});\n props.onAction(props.content);\n }\n\n render() {\n const {content} = this.props;\n return (\n
    \n
    \n
    \n \n

    {content.title}

    \n

    {content.text}

    \n     \n \n \n \n
    \n
    \n );\n }\n}\n\nexport class OnboardingMessage extends React.PureComponent {\n render() {\n const {props} = this;\n return (\n \n
    \n {props.bundle.map(message => (\n \n ))}\n
    \n     \n );\n }\n}\n","export const cardContextTypes = {\n history: {\n intlID: \"type_label_visited\",\n icon: \"history-item\"\n },\n bookmark: {\n intlID: \"type_label_bookmarked\",\n icon: \"bookmark-added\"\n },\n trending: {\n intlID: \"type_label_recommended\",\n icon: \"trending\"\n },\n now: {\n intlID: \"type_label_now\",\n icon: \"now\"\n },\n pocket: {\n intlID: \"type_label_pocket\",\n icon: \"pocket\"\n },\n download: {\n intlID: \"type_label_downloaded\",\n icon: \"download\"\n }\n};\n","import {actionCreators as ac, actionTypes as at} from \"common/Actions.jsm\";\nimport {cardContextTypes} from \"./types\";\nimport {connect} from \"react-redux\";\nimport {FormattedMessage} from \"react-intl\";\nimport {GetPlatformString} from \"content-src/lib/link-menu-options\";\nimport {LinkMenu} from \"content-src/components/LinkMenu/LinkMenu\";\nimport React from \"react\";\nimport {ScreenshotUtils} from \"content-src/lib/screenshot-utils\";\n\n// Keep track of pending image loads to only request once\nconst gImageLoading = new Map();\n\n/**\n * Card component.\n * Cards are found within a Section component and contain information about a link such\n * as preview image, page title, page description, and some context about if the page\n * was visited, bookmarked, trending etc...\n * Each Section can make an unordered list of Cards which will create one instane of\n * this class. Each card will then get a context menu which reflects the actions that\n * can be done on this Card.\n */\nexport class _Card extends React.PureComponent {\n constructor(props) {\n super(props);\n this.state = {\n activeCard: null,\n imageLoaded: false,\n showContextMenu: false,\n cardImage: null\n };\n this.onMenuButtonClick = this.onMenuButtonClick.bind(this);\n this.onMenuUpdate = this.onMenuUpdate.bind(this);\n this.onLinkClick = this.onLinkClick.bind(this);\n }\n\n /**\n * Helper to conditionally load an image and update state when it loads.\n */\n async maybeLoadImage() {\n // No need to load if it's already loaded or no image\n const {cardImage} = this.state;\n if (!cardImage) {\n return;\n }\n\n const imageUrl = cardImage.url;\n if (!this.state.imageLoaded) {\n // Initialize a promise to share a load across multiple card updates\n if (!gImageLoading.has(imageUrl)) {\n const loaderPromise = new Promise((resolve, reject) => {\n const loader = new Image();\n loader.addEventListener(\"load\", resolve);\n loader.addEventListener(\"error\", reject);\n loader.src = imageUrl;\n });\n\n // Save and remove the promise only while it's pending\n gImageLoading.set(imageUrl, loaderPromise);\n loaderPromise.catch(ex => ex).then(() => gImageLoading.delete(imageUrl)).catch();\n }\n\n // Wait for the image whether just started loading or reused promise\n await gImageLoading.get(imageUrl);\n\n // Only update state if we're still waiting to load the original image\n if (ScreenshotUtils.isRemoteImageLocal(this.state.cardImage, this.props.link.image) &&\n !this.state.imageLoaded) {\n this.setState({imageLoaded: true});\n }\n }\n }\n\n /**\n * Helper to obtain the next state based on nextProps and prevState.\n *\n * NOTE: Rename this method to getDerivedStateFromProps when we update React\n * to >= 16.3. We will need to update tests as well. We cannot rename this\n * method to getDerivedStateFromProps now because there is a mismatch in\n * the React version that we are using for both testing and production.\n * (i.e. react-test-render => \"16.3.2\", react => \"16.2.0\").\n *\n * See https://github.com/airbnb/enzyme/blob/master/packages/enzyme-adapter-react-16/package.json#L43.\n */\n static getNextStateFromProps(nextProps, prevState) {\n const {image} = nextProps.link;\n const imageInState = ScreenshotUtils.isRemoteImageLocal(prevState.cardImage, image);\n let nextState = null;\n\n // Image is updating.\n if (!imageInState && nextProps.link) {\n nextState = {imageLoaded: false};\n }\n\n if (imageInState) {\n return nextState;\n }\n\n // Since image was updated, attempt to revoke old image blob URL, if it exists.\n ScreenshotUtils.maybeRevokeBlobObjectURL(prevState.cardImage);\n\n nextState = nextState || {};\n nextState.cardImage = ScreenshotUtils.createLocalImageObject(image);\n\n return nextState;\n }\n\n onMenuButtonClick(event) {\n event.preventDefault();\n this.setState({\n activeCard: this.props.index,\n showContextMenu: true\n });\n }\n\n /**\n * Report to telemetry additional information about the item.\n */\n _getTelemetryInfo() {\n // Filter out \"history\" type for being the default\n if (this.props.link.type !== \"history\") {\n return {value: {card_type: this.props.link.type}};\n }\n\n return null;\n }\n\n onLinkClick(event) {\n event.preventDefault();\n if (this.props.link.type === \"download\") {\n this.props.dispatch(ac.OnlyToMain({\n type: at.SHOW_DOWNLOAD_FILE,\n data: this.props.link\n }));\n } else {\n const {altKey, button, ctrlKey, metaKey, shiftKey} = event;\n this.props.dispatch(ac.OnlyToMain({\n type: at.OPEN_LINK,\n data: Object.assign(this.props.link, {event: {altKey, button, ctrlKey, metaKey, shiftKey}})\n }));\n }\n if (this.props.isWebExtension) {\n this.props.dispatch(ac.WebExtEvent(at.WEBEXT_CLICK, {\n source: this.props.eventSource,\n url: this.props.link.url,\n action_position: this.props.index\n }));\n } else {\n this.props.dispatch(ac.UserEvent(Object.assign({\n event: \"CLICK\",\n source: this.props.eventSource,\n action_position: this.props.index\n }, this._getTelemetryInfo())));\n\n if (this.props.shouldSendImpressionStats) {\n this.props.dispatch(ac.ImpressionStats({\n source: this.props.eventSource,\n click: 0,\n tiles: [{id: this.props.link.guid, pos: this.props.index}]\n }));\n }\n }\n }\n\n onMenuUpdate(showContextMenu) {\n this.setState({showContextMenu});\n }\n\n componentDidMount() {\n this.maybeLoadImage();\n }\n\n componentDidUpdate() {\n this.maybeLoadImage();\n }\n\n // NOTE: Remove this function when we update React to >= 16.3 since React will\n // call getDerivedStateFromProps automatically. We will also need to\n // rename getNextStateFromProps to getDerivedStateFromProps.\n componentWillMount() {\n const nextState = _Card.getNextStateFromProps(this.props, this.state);\n if (nextState) {\n this.setState(nextState);\n }\n }\n\n // NOTE: Remove this function when we update React to >= 16.3 since React will\n // call getDerivedStateFromProps automatically. We will also need to\n // rename getNextStateFromProps to getDerivedStateFromProps.\n componentWillReceiveProps(nextProps) {\n const nextState = _Card.getNextStateFromProps(nextProps, this.state);\n if (nextState) {\n this.setState(nextState);\n }\n }\n\n componentWillUnmount() {\n ScreenshotUtils.maybeRevokeBlobObjectURL(this.state.cardImage);\n }\n\n render() {\n const {index, className, link, dispatch, contextMenuOptions, eventSource, shouldSendImpressionStats} = this.props;\n const {props} = this;\n const isContextMenuOpen = this.state.showContextMenu && this.state.activeCard === index;\n // Display \"now\" as \"trending\" until we have new strings #3402\n const {icon, intlID} = cardContextTypes[link.type === \"now\" ? \"trending\" : link.type] || {};\n const hasImage = this.state.cardImage || link.hasImage;\n const imageStyle = {backgroundImage: this.state.cardImage ? `url(${this.state.cardImage.url})` : \"none\"};\n const outerClassName = [\n \"card-outer\",\n className,\n isContextMenuOpen && \"active\",\n props.placeholder && \"placeholder\"\n ].filter(v => v).join(\" \");\n\n return (
  • \n \n
    • );\n }\n}\n_Card.defaultProps = {link: {}};\nexport const Card = connect(state => ({platform: state.Prefs.values.platform}))(_Card);\nexport const PlaceholderCard = props => ;\n","import {FormattedMessage} from \"react-intl\";\nimport React from \"react\";\n\nexport class TopSiteFormInput extends React.PureComponent {\n constructor(props) {\n super(props);\n this.state = {validationError: this.props.validationError};\n this.onChange = this.onChange.bind(this);\n this.onMount = this.onMount.bind(this);\n }\n\n componentWillReceiveProps(nextProps) {\n if (nextProps.shouldFocus && !this.props.shouldFocus) {\n this.input.focus();\n }\n if (nextProps.validationError && !this.props.validationError) {\n this.setState({validationError: true});\n }\n // If the component is in an error state but the value was cleared by the parent\n if (this.state.validationError && !nextProps.value) {\n this.setState({validationError: false});\n }\n }\n\n onChange(ev) {\n if (this.state.validationError) {\n this.setState({validationError: false});\n }\n this.props.onChange(ev);\n }\n\n onMount(input) {\n this.input = input;\n }\n\n render() {\n const showClearButton = this.props.value && this.props.onClear;\n const {typeUrl} = this.props;\n const {validationError} = this.state;\n\n return (