diff options
author | Peter Bengtsson <mail@peterbe.com> | 2021-07-15 13:01:50 -0400 |
---|---|---|
committer | GitHub <noreply@github.com> | 2021-07-15 13:01:50 -0400 |
commit | 037a4118c4324d39fdef8bd23f9dd21b02f50946 (patch) | |
tree | 22dac72fd38b56df6f2caf0fb7f21cb187179e76 /files/pl/tools | |
parent | 335d06b805fab26d8d4b3e1378e7722c12f715fe (diff) | |
download | translated-content-037a4118c4324d39fdef8bd23f9dd21b02f50946.tar.gz translated-content-037a4118c4324d39fdef8bd23f9dd21b02f50946.tar.bz2 translated-content-037a4118c4324d39fdef8bd23f9dd21b02f50946.zip |
delete pages that were never translated from en-US (pl, part 1) (#1549)
Diffstat (limited to 'files/pl/tools')
-rw-r--r-- | files/pl/tools/browser_toolbox/index.html | 41 | ||||
-rw-r--r-- | files/pl/tools/performance/flame_chart/index.html | 104 | ||||
-rw-r--r-- | files/pl/tools/storage_inspector/index.html | 207 | ||||
-rw-r--r-- | files/pl/tools/tools_toolbox/index.html | 114 | ||||
-rw-r--r-- | files/pl/tools/view_source/index.html | 83 |
5 files changed, 0 insertions, 549 deletions
diff --git a/files/pl/tools/browser_toolbox/index.html b/files/pl/tools/browser_toolbox/index.html deleted file mode 100644 index 6fad126ff6..0000000000 --- a/files/pl/tools/browser_toolbox/index.html +++ /dev/null @@ -1,41 +0,0 @@ ---- -title: Browser Toolbox -slug: Tools/Browser_Toolbox -translation_of: Tools/Browser_Toolbox -original_slug: Narzędzia/Browser_Toolbox ---- -<p>The Browser Toolbox enables you to debug add-ons and the browser's own JavaScript code rather than just web pages like the normal <a href="/en-US/docs/Tools_Toolbox">Toolbox</a>. The Browser Toolbox's context is the whole browser rather than just single page on a single tab.</p> - -<p><em>Note: If you want to debug a specific add-on that is restartless or SDK-based then try the <a href="/en-US/Add-ons/Add-on_Debugger">Add-on Debugger</a>. Use the Browser Toolbox for add-ons that are neither.</em></p> - -<h2 id="Enabling_the_Browser_Toolbox" style="line-height: 30px; font-size: 2.14285714285714rem;">Enabling the Browser Toolbox </h2> - -<div> -<p>The Browser Toolbox is not enabled by default. To enable it you need to check the settings "Enable chrome and addon debugging" and "Enable remote debugging".</p> - -<p>To do this, open the Developer Tools <a href="https://developer.mozilla.org/en-US/docs/Tools/Tools_Toolbox">Toolbox</a>'s <a href="https://developer.mozilla.org/en-US/docs/Tools/Tools_Toolbox#Settings">Settings</a>, go to the section "<a href="https://developer.mozilla.org/en-US/docs/Tools/Tools_Toolbox#Advanced_settings">Advanced Settings</a>", and check the settings "Enable chrome and addon debugging" and "Enable remote debugging".</p> -</div> - -<h2 id="Opening_the_Browser_Toolbox"><span style="font-size: 2.14285714285714rem;">Opening</span> the Browser Toolbox</h2> - -<p><span style="line-height: 1.5;">Open the Browser Toolbox through the </span><span style="line-height: 1.5;">menu button </span><img alt="new fx menu" class="wiki-image frameless" src="https://support.cdn.mozilla.net/media/uploads/gallery/images/2014-01-10-13-08-08-f52b8c.png" style="line-height: 1.5;" title=""><span style="line-height: 1.5;"> and the menu items "Developer" then "Browser Toolbox".</span><span style="line-height: 1.5;"> </span></p> - -<p><span style="line-height: 1.5;">Click the menu item and you'll be presented with a dialog like this (this can be removed by setting the </span><code style="font-style: normal; line-height: 1.5;">devtools.debugger.prompt-connection</code><span style="line-height: 1.5;"> property to false):</span></p> - -<p><img alt="" src="https://mdn.mozillademos.org/files/6663/warning.png" style="width: 554px; height: 243px; display: block; margin-left: auto; margin-right: auto;">Click OK, and the Browser Toolbox will open in its own window:</p> - -<p><img alt="" src="https://mdn.mozillademos.org/files/6665/browser-toolbox.png" style="display: block; margin-left: auto; margin-right: auto;">You'll see, and be able to debug, all the JavaScript files loaded by the browser itself and by any add-ons that are running. Altogether you will have access to the following developer tools:</p> - -<ul> - <li><a href="/en-US/docs/Tools/Debugger">Debugger</a> (<em>Note: If you want to debug a specific add-on that is restartless or SDK-based then try the <a href="/en-US/Add-ons/Add-on_Debugger">Add-on Debugger</a>.)</em></li> - <li><a href="/en-US/docs/Tools/Browser_Console">Console</a></li> - <li><a href="/en-US/docs/Tools/Style_Editor">Style Editor</a></li> - <li><a href="/en-US/docs/Tools/Profiler">Profiler</a></li> - <li><a href="/en-US/docs/Tools/Network_Monitor">Network Monitor</a></li> - <li><a href="/en-US/docs/Tools/Scratchpad">Scratchpad</a></li> - <li><a href="/en-US/docs/Tools/Page_Inspector">Page Inspector</a></li> -</ul> - -<h2 id="Debugging_chrome_and_about_pages">Debugging chrome: and about: pages</h2> - -<p>From Firefox 37 onwards, you can debug chrome: and about: pages using the normal <a href="/en-US/docs/Tools/Debugger">Debugger</a>, just as if they were ordinary content pages.</p> diff --git a/files/pl/tools/performance/flame_chart/index.html b/files/pl/tools/performance/flame_chart/index.html deleted file mode 100644 index 60b17d4011..0000000000 --- a/files/pl/tools/performance/flame_chart/index.html +++ /dev/null @@ -1,104 +0,0 @@ ---- -title: Flame Chart -slug: Tools/Performance/Flame_Chart -translation_of: Tools/Performance/Flame_Chart -original_slug: Narzędzia/Performance/Flame_Chart ---- -<div class="summary"> -<p>The Flame Chart shows you the state of the JavaScript stack for your code at every millisecond during the performance profile.</p> - -<p>This gives you a way to know exactly which function was executing at any point during the recording, how long it ran for, and where it was called from.</p> -</div> - -<p>The Call Tree and the Flame Chart are both used to analyze your site's JavaScript, and they both use the same data: a sample of the JavaScript engine's stack, taken periodically during the recording.</p> - -<p>But while the Call Tree organizes this data to show you where your program is spending most time in aggregate across the recording, the Flame Chart uses it to show you when in the recording particular functions are executing. Essentially it shows you the state of the call stack at any given point during the recording.</p> - -<p>Here's a screenshot showing the Flame Chart for a section of a profile:</p> - -<p><img alt="" src="https://mdn.mozillademos.org/files/10989/perf-flame-chart-overview.png" style="display: block; height: 622px; margin-left: auto; margin-right: auto; width: 1676px;"></p> - -<p>First of all, you'll see that, in the <a href="/en-US/docs/Tools/Performance/UI_Tour#Recording_overview">recording overview pane</a>, we've selected a small slice of the recording to view in the Flame Chart. The Flame Chart displays a lot of data, so to get readable results, it's usually necessary to zoom in.</p> - -<p>In the Flame Chart view itself, along the X-axis is time. The screenshot above covers the period from 1435ms to a little past 1465ms. Along the Y-axis are the functions on the call stack at that point in time, with the top-level at the top, and the leaf function at the bottom. Functions are color-coded to make them easier to distinguish.</p> - -<p>This gives you a way to know exactly which function was executing at any point during the recording, how long it ran for, and where it was called from.</p> - -<h2 id="Zooming_and_panning">Zooming and panning</h2> - -<p>To work effectively with the Flame Chart, you'll need to be able to navigate it. There are two main controls you can use to navigate the Flame Chart:</p> - -<table class="standard-table"> - <tbody> - <tr> - <td><strong>Zoom</strong>: increase/decrease the selected portion of the complete profile that's displayed in the Flame Chart</td> - <td> - <p>1) Mouse wheel up/down in the Flame Chart.</p> - - <p>2) Trackpad 2 fingers up/down in the Flame Chart.</p> - </td> - </tr> - <tr> - <td><strong>Pan</strong>: move the selected portion of the complete profile left and right</td> - <td> - <p>1) Click and drag the selected portion in the <a href="/en-US/docs/Tools/Performance/UI_Tour#Recording_overview">recording overview pane</a>.</p> - - <p>2) Click and drag anywhere in the Flame Chart.</p> - </td> - </tr> - </tbody> -</table> - -<p>{{EmbedYouTube("BzfkBRFucp8")}}</p> - -<h2 id="An_example">An example</h2> - -<p>To see how the Flame Chart can reveal the behavior of your program, we'll look at a simple example. We'll use the same example as in the <a href="/en-US/docs/Tools/Performance/Call_Tree">Call Tree</a> page: a program that compares three different sorting algorithms. There's a <a href="/en-US/docs/Tools/Performance/Examples/Sorting_algorithms_comparison">separate page</a> that gives an overview of this program's structure.</p> - -<p>We'll use the same profile file as that used in the Call Tree page. In the call tree page, we figured out that the program call graph in that profile, and the associated sample count, looked like this:</p> - -<pre>sortAll() // 8 - - -> sort() // 37 - - -> bubbleSort() // 1345 - - -> swap() // 252 - - -> selectionSort() // 190 - - -> swap() // 1 - - -> quickSort() // 103 - - -> partition() // 12</pre> - -<p>First, we'll just select the whole section in which the program was active:</p> - -<p><img alt="" src="https://mdn.mozillademos.org/files/10991/perf-flame-chart-zoomed-out.png" style="display: block; height: 350px; margin-left: auto; margin-right: auto; width: 1212px;"></p> - -<p>At the top, colored purple, is the <code>sortAll()</code> call, running throughout the program from start to finish. Underneath that, colored olive-green, are the calls it's making to <code>sort()</code>. Underneath that, like the teeth of a comb, are all the calls being made to each sorting algorithm.</p> - -<p>Let's zoom in:</p> - -<p><img alt="" src="https://mdn.mozillademos.org/files/10993/perf-flame-chart-zoom-1.png" style="display: block; height: 350px; margin-left: auto; margin-right: auto; width: 1212px;"></p> - -<p>This slice is about 140 ms long, and shows us more details of the functions being called by <code>sort()</code>. The <code>sort()</code> code is just this:</p> - -<pre class="brush: js">function sort(unsorted) { - console.log(bubbleSort(unsorted)); - console.log(selectionSort(unsorted)); - console.log(quickSort(unsorted)); -}</pre> - -<p>The markers labeled "bubb..." and colored olive-green are presumably <code>bubbleSort()</code>. The ones colored plain green are presumably the other sort functions. Even at a glance, we can see that the bubble sort blocks are much wider (of a longer duration) than the others.</p> - -<p>We can also see some functions being called from <code>bubbleSort()</code>, colored purple.</p> - -<p>Let's zoom in one more time:</p> - -<p><img alt="" src="https://mdn.mozillademos.org/files/10995/perf-flame-chart-zoom-2.png" style="display: block; height: 348px; margin-left: auto; margin-right: auto; width: 1212px;"></p> - -<p>This slice is about 20ms long. We can see that the purple markers underneath <code>bubbleSort()</code> are the calls to <code>swap()</code>. If you counted them all, the Call Tree view tells us that you'd see 253 of them. All the ones in this zoom are underneath <code>bubbleSort()</code>, but according to the Call Tree view, the profile does contain one under <code>selectionSort()</code>.</p> - -<p>We can also see that two of the green markers are for <code>selectionSort()</code> and <code>quickSort()</code>, but we're also seeing calls to platform (Gecko) code in between our calls to the sorting functions. It seems very likely that this is from the <code>console.log()</code> calls in <code>sort()</code>.</p> diff --git a/files/pl/tools/storage_inspector/index.html b/files/pl/tools/storage_inspector/index.html deleted file mode 100644 index 4919111886..0000000000 --- a/files/pl/tools/storage_inspector/index.html +++ /dev/null @@ -1,207 +0,0 @@ ---- -title: Storage Inspector -slug: Tools/Storage_Inspector -translation_of: Tools/Storage_Inspector -original_slug: Narzędzia/Storage_Inspector ---- -<div>{{ToolsSidebar}}</div> - -<p>The Storage Inspector enables you to inspect various types of storage that a web page can use. Currently it can be used to inspect the following storage types:</p> - -<ul> - <li><em>Cache Storage</em> — any DOM caches created using the <a href="/en-US/docs/Web/API/Cache">Cache API</a>.</li> - <li><em>Cookies</em> — All the <a href="/en-US/docs/Web/API/Document/cookie">cookies</a> created by the page or any iframes inside of the page. Cookies created as a part of response of network calls are also listed, but only for calls that happened while the tool is open.</li> - <li><em>IndexedDB</em> — All <a href="/en-US/docs/Web/API/IndexedDB_API">IndexedDB</a> databases created by the page or any iframes inside the page, their Object Stores and the items stored in these Object Stores.</li> - <li><em>Local Storage</em> — All <a href="/en-US/docs/Web/API/Window/localStorage">local storage</a> items created by the page or any iframes inside the page.</li> - <li><em>Session Storage</em> — All <a href="/en-US/docs/Web/API/Window/sessionStorage">session storage</a> items created by the page or any iframes inside the page.</li> -</ul> - -<p>For the time being, the Storage Inspector only gives you a read-only view of storage. But we're working to let you edit storage contents in future releases.</p> - -<h2 id="Opening_the_Storage_Inspector">Opening the Storage Inspector</h2> - -<p>You can open the Storage Inspector by selecting "Storage Inspector" from the Web Developer submenu in the Firefox Menu Panel (or Tools menu if you display the menu bar or are on macOS), or by pressing its <kbd>Shift</kbd> + <kbd>F9</kbd> keyboard shortcut.</p> - -<p>The <a href="https://developer.mozilla.org/en-US/docs/Tools/DevTools_Window" title="/en-US/docs/Tools/DevTools_Window">Toolbox</a> will appear at the bottom of the browser window, with the Storage Inspector activated. It's just called "Storage" in the Developer Toolbox.</p> - -<p><img alt="" src="https://mdn.mozillademos.org/files/16764/storage_inspector.png" style="display: block; margin: 0px auto; width: 600px;"></p> - -<h2 id="Storage_Inspector_User_Interface">Storage Inspector User Interface</h2> - -<p>The Storage Inspector UI is split into three main components:</p> - -<ul> - <li><a href="#storage-tree">Storage tree</a></li> - <li><a href="#table-widget">Table Widget</a></li> - <li><a href="#sidebar">Sidebar</a></li> -</ul> - -<p><img alt="" src="https://mdn.mozillademos.org/files/16765/storage_labeled.png" style="display: block; margin: 0 auto; width: 600px;"></p> - -<h3 id="Storage_tree"><a name="storage-tree">Storage tree</a></h3> - -<p>The storage tree lists all the storage types that the Storage Inspector can inspect:</p> - -<p><img alt="" src="https://mdn.mozillademos.org/files/16766/storage_types.png" style="display: block; height: 129px; margin: 0 auto; width: 400px;"></p> - -<p>Under each type, objects are organized by origin. For cookies, the protocol does not differentiate the origin. For Indexed DB or local storage an origin is a combination of protocol + hostname. For example, "http://mozilla.org" and "https://mozilla.org" are two different origins so local storage items cannot be shared between them.</p> - -<p>Under "Cache Storage", objects are organized by origin and then by the name of the cache:</p> - -<p><img alt="" src="https://mdn.mozillademos.org/files/16802/cache_storage.png" style="border: 1px solid black; display: block; height: 215px; margin-left: auto; margin-right: auto; width: 274px;"></p> - -<p>IndexedDB objects are organized by origin, then by database name, then by object store name:</p> - -<p><img alt="" src="https://mdn.mozillademos.org/files/16804/indexedDb_storage.png" style="border: 1px solid black; display: block; height: 193px; margin-left: auto; margin-right: auto; width: 274px;"></p> - -<p>With the Cookies, Local Storage, and Session Storage types, there's only one level in the hierarchy, so stored items are listed directly under each origin:</p> - -<p><img alt="" src="https://mdn.mozillademos.org/files/16803/cookie_storage.png" style="border: 1px solid black; display: block; height: 217px; margin-left: auto; margin-right: auto; width: 274px;"></p> - -<p>You can click on each item in the tree to expand or collapse its children. The tree is live, so if a new origin gets added (by adding an iframe, for example), it will be added to each storage type automatically.</p> - -<p>Clicking on a tree item will display detailed information about that item in the Table Widget on the right. For example, clicking on an origin which is a child of the Cookies storage type will show all the cookies belonging to that domain.</p> - -<h3 id="Table_Widget"><a name="table-widget">Table Widget</a></h3> - -<p>The table widget displays a list of all the items corresponding to the selected tree item (be it an origin, or database) are listed. Depending on the storage type and tree item, the number of columns in the table might differ.</p> - -<p>All the columns in a Table Widget are resizable. You can hide and show columns by context-clicking on the table header and selecting the columns you want to see:</p> - -<p><img alt="" src="https://mdn.mozillademos.org/files/16767/cookie_context_menu.png" style="border: 1px solid black; display: block; height: 330px; margin-left: auto; margin-right: auto; width: 914px;"></p> - -<h3 id="Search">Search</h3> - -<p>There's a search box at the top of the Table Widget:</p> - -<p><img alt="" src="https://mdn.mozillademos.org/files/16808/storage_detail_filter.png" style="border: 1px solid black; display: block; height: 249px; margin-left: auto; margin-right: auto; width: 926px;"></p> - -<p>This filters the table to show only items which match the search term. Items match the search term if any of their fields (including fields whose columns you have hidden) contain the search term.</p> - -<p>You can use <kbd>Ctrl</kbd> + <kbd>F</kbd> (<kbd>Cmd</kbd> + <kbd>F</kbd> on a Mac) to focus the search box.</p> - -<h3 id="Add_and_refresh_storage">Add and refresh storage</h3> - -<p>You'll also have buttons available to add a new storage entry or refresh the view of the currently viewed storage type where applicable (you can't add new entries to IndexedDB or Cache):</p> - -<p><img alt="" src="https://mdn.mozillademos.org/files/16809/storage_detail_add_refresh.png" style="border: 1px solid black; display: block; height: 249px; margin: 0px auto; width: 926px;"></p> - -<h3 id="Sidebar"><a name="sidebar">Sidebar</a></h3> - -<p>When you select any row in the Storage table widget, the sidebar is shown with details about that row. If a cookie is selected, it will list all the details about that cookie.</p> - -<p>The sidebar can parse the value of the cookie or local storage item or an IndexedDB item and convert it into a meaningful object instead of just a string. For example:</p> - -<ul> - <li>A stringified JSON like <code>'{"foo": "bar"}'</code> is shown as the origin JSON: <code>{foo: "bar"}</code>.</li> - <li>A string containing a key separated value, like <code>"1~2~3~4"</code> or <code>"1=2=3=4"</code> is shown like an array: <code>[1, 2, 3, 4]</code>.</li> - <li>A string containing key-value pairs, like <code>"ID=1234:foo=bar"</code> is shown as JSON: <code>{ID:1234, foo: "bar"}</code>.</li> -</ul> - -<p>The shown values can also be filtered using the search box at the top of the sidebar.</p> - -<h2 id="Cache_Storage">Cache Storage</h2> - -<p>Under the Cache Storage type you can see the contents of any DOM caches created using the <a href="/en-US/docs/Web/API/Cache">Cache API</a>. If you select a cache, you'll see a list of the resources it contains. For each resource, you'll see:</p> - -<ul> - <li>the URL for the resource</li> - <li>the status code for the request that was made to fetch it.</li> -</ul> - -<p><img alt="" src="https://mdn.mozillademos.org/files/16810/cache_storage_detail.png" style="border: 1px solid black; display: block; height: 251px; margin-left: auto; margin-right: auto; width: 926px;"></p> - -<h2 id="Cookies">Cookies</h2> - -<p>When you select an origin inside the Cookies storage type from the storage tree, all the cookies present for that origin will be listed in the table widget. The cookies table has the following columns:</p> - -<ul> - <li><em>Name</em> — The name of the cookie</li> - <li><em>Path</em> — The path property of the cookie</li> - <li><em>Domain</em> — The domain of the cookie</li> - <li><em>Expires on</em> — The time when the cookie will expire. If the cookie is a session cookie, the value of this column will be "Session"</li> - <li><em>Last accessed on</em> — When the cookie was last read</li> - <li>Created on — When the cookie was created</li> - <li><em>Value</em> — The value of the cookie</li> - <li><em>HostOnly</em> — Is this cookie a domain cookie: that is, the domain value starts with a "."</li> - <li><em>Secure</em> — Is this cookie a secure cookie</li> - <li><em>HttpOnly</em> — Is this cookie HTTP only</li> - <li><em>sameSite</em> — Is this cookie a same-site cookie? Same-site cookies allow servers to mitigate the risk of CSRF and information leakage attacks by asserting that a particular cookie should only be sent with requests initiated from the same registrable domain.</li> -</ul> - -<div class="note"> -<p><strong>Note</strong>: Some of the columns are not shown by default — to change the column display, right-click on the existing table headings and use the resulting context menu to show/hide the columns.</p> -</div> - -<p>You can edit cookies by double-clicking inside cells in the <a href="/en-US/docs/Tools/Storage_Inspector#Table_Widget">Table Widget</a> and editing the values they contain, and add new cookies by clicking the "Plus" (+) button and then editing the resulting new row to the value you want.</p> - -<h3 id="Context_menu">Context menu</h3> - -<p>The context menu for each cookie includes the following commands:</p> - -<ul> - <li><em>Add item</em> - add a new cookie.</li> - <li><em>Delete <cookie name>.<domain></em> - deletes the selected cookie</li> - <li><em>Delete All From <domain></em> - deletes all cookies from the selected domain. This must be an exact match. For example, if you select "Delete All From test8.example.com" only cookies from that domain will be deleted. Cookies from "test13.example.com" will not be deleted.</li> - <li><em>Delete All</em> - deletes all cookies for the current host.</li> - <li><em>Delete All Session Cookies</em> - deletes all cookies for the current host that are scheduled to be deleted when the browser shuts down</li> -</ul> - -<p><img alt="" src="https://mdn.mozillademos.org/files/16811/cookie_table_widget_context.png" style="border: 1px solid black; display: block; height: 250px; margin-left: auto; margin-right: auto; width: 924px;"></p> - -<h2 id="Local_storage_Session_storage">Local storage / Session storage</h2> - -<p>When an origin corresponding to local storage or session storage is selected, the table will list the name and value of all the items corresponding to local storage or session storage.</p> - -<p>You can edit local and session storage items by double-clicking inside cells in the <a href="/en-US/docs/Tools/Storage_Inspector#Table_Widget">Table Widget</a> and editing the values they contain:</p> - -<p>{{EmbedYouTube("UKLgBBUi11c")}}</p> - -<p>You can delete local storage and session storage entries using the context menu:</p> - -<p><img alt="" src="https://mdn.mozillademos.org/files/16768/delete_storage_menu.png" style="border: 1px solid black; display: block; height: 270px; margin-left: auto; margin-right: auto; width: 914px;"></p> - -<p>In Firefox 68 and later, you can also delete local and session storage entries by selecting the item and pressing the backspace key.</p> - -<p>Finally, you can add new storage items by clicking the "Plus" (+) button and then editing the resulting new row to the value you want.</p> - -<h2 id="IndexedDB">IndexedDB</h2> - -<p>When you select an origin inside the Indexed DB storage type in the storage tree, the table lists the details of all the databases present for that origin.</p> - -<div class="blockIndicator note"> -<p><strong>Note</strong>: The data shown in an IndexedDB database is a snapshot of the data as it was when you opened the Storage Inspector tool.</p> -</div> - -<p>Databases have the following details:</p> - -<ul> - <li><em>Database Name</em> — The name of the database</li> - <li><em>Storage</em> — The <a href="/en-US/docs/Web/API/IndexedDB_API/Browser_storage_limits_and_eviction_criteria#Different_types_of_data_storage">storage type</a> specified for the database</li> - <li><em>Origin</em> — Its origin</li> - <li><em>Version</em> — The database version</li> - <li><em>Object Stores</em> — Number of object stores in the database</li> -</ul> - -<p>When an IndexedDB database is selected in the storage tree, details about all the object stores are listed in the table. Any object store has the following details:</p> - -<ul> - <li><em>Object Store Name</em> — The name of the object store</li> - <li><em>Key</em> — The keyPath property of the object store.</li> - <li><em>Auto Increment</em> — Whether auto increment is enabled</li> - <li><em>Indexes</em> — Array of indexes present in the object store as shown below</li> -</ul> - -<p><img alt="" src="https://mdn.mozillademos.org/files/16812/indexed_db_details.png" style="border: 1px solid black; display: block; height: 250px; margin-left: auto; margin-right: auto; width: 926px;"></p> - -<p>When an object store is selected in the storage tree, all the items in that object store are listed in the table. All items have a key and a value associated with them.</p> - -<p>You can delete an IndexedDB database using the context menu in the Storage tree view:</p> - -<p><img alt="" src="https://mdn.mozillademos.org/files/16813/indexed_db_context_menu.png" style="border: 1px solid black; display: block; height: 249px; margin-left: auto; margin-right: auto; width: 924px;"></p> - -<p>If the database cannot be deleted (most commonly because there are still active connections to the database), a warning message will be displayed in the Storage Inspector:<img alt="" src="https://mdn.mozillademos.org/files/16815/indexedDB_delete_warning.png" style="border: 1px solid black; display: block; height: 250px; margin: 0px auto; width: 926px;"></p> - -<p>You can use the context menu in the table widget to delete all items in an object store, or a particular item:</p> - -<p><img alt="" src="https://mdn.mozillademos.org/files/16814/indexed_db_table_widget_context.png" style="border: 1px solid black; display: block; height: 249px; margin-left: auto; margin-right: auto; width: 924px;"></p> diff --git a/files/pl/tools/tools_toolbox/index.html b/files/pl/tools/tools_toolbox/index.html deleted file mode 100644 index 8d88d8469f..0000000000 --- a/files/pl/tools/tools_toolbox/index.html +++ /dev/null @@ -1,114 +0,0 @@ ---- -title: Toolbox -slug: Tools/Tools_Toolbox -translation_of: Tools/Tools_Toolbox -original_slug: Narzędzia/Tools_Toolbox ---- -<p>The Toolbox provides a single home for most of the developer tools that are built into Firefox. You can open it by selecting "Toggle Tools" from the Web Developer menu (under "Tools" on OS X and Linux, or "Firefox" on Windows), or by activating any tool hosted in it (for example, the JavaScript Debugger or the Page Inspector). Alternatively you can press Ctrl + Shift + I on Windows and Linux, or Cmd + Opt + I on OS X.</p> -<p>By default, the window appears docked to the bottom side of the Firefox window, but you can detach it if you like. This is what it looks like when it's docked:</p> -<p><img alt="" src="https://mdn.mozillademos.org/files/6923/toolbox.png" style="display: block; margin-left: auto; margin-right: auto;">The window itself is split into two parts: a toolbar along the top, and a main pane underneath:</p> -<p><img alt="" src="https://mdn.mozillademos.org/files/6925/toolbox-annotated-29.png" style="display: block; margin-left: auto; margin-right: auto;"></p> -<h2 id="Toolbar">Toolbar</h2> -<p>The toolbar contains controls to activate a particular tool, to dock/float the window, and to close the window.</p> -<p><img alt="" src="https://mdn.mozillademos.org/files/7913/toolbox-toolbar-annotated.png" style="display: block; margin-left: auto; margin-right: auto;"></p> -<h3 id="Node_picker">Node picker</h3> -<p>On the far left there's a button to activate the node picker. This lets you select a page element for inspection. See <a href="/en-US/docs/Tools/Page_Inspector#Selecting_elements">"Selecting elements"</a>.</p> -<h3 id="Toolbox-hosted_tools">Toolbox-hosted tools</h3> -<p>Then there is an array of labeled buttons which enables you to switch between the different tools hosted by the Toolbox. The array may include the following tools:</p> -<ul> - <li><a href="/en-US/docs/Tools/Web_Console" title="/en-US/docs/Tools/Web_Console">Web Console</a></li> - <li><a href="/en-US/docs/Tools/Debugger" title="/en-US/docs/Tools/Debugger">JavaScript Debugger</a></li> - <li><a href="/en-US/docs/Tools/Page_Inspector" title="/en-US/docs/Tools/Page_Inspector">Page Inspector</a></li> - <li><a href="/en-US/docs/Tools/Style_Editor" title="/en-US/docs/Tools/Style_Editor">Style Editor</a></li> - <li><a href="/en-US/docs/Tools/Profiler" title="/en-US/docs/Performance/Profiling_with_the_Built-in_Profiler">Profiler</a></li> - <li><a href="/en-US/docs/Tools/Network_Monitor" title="/en-US/docs/Performance/Profiling_with_the_Built-in_Profiler">Network Monitor</a></li> -</ul> -<p>Note that not all the hosted tools are always listed here: only the tools actually available in this context are shown (for example, not all tools support remote debugging yet, so if the debugging target is not the Firefox instance that launched the window, not all the hosted tools will be shown).</p> -<h3 id="Extra_tools">Extra tools</h3> -<p>Next there's an array of buttons that can be added or removed in the <a href="#Settings">developer tool settings</a>. By default this array includes:</p> -<ul> - <li><a href="/en-US/docs/Tools/Web_Console#The_split_console">Toggle split console</a></li> - <li><a href="/en-US/docs/Tools/Responsive_Design_View">Responsive Design Mode</a></li> -</ul> -<p>The following tools are not included in the toolbar by default, but you can add them in the <a href="#Settings">settings</a>:</p> -<ul> - <li><a href="/en-US/docs/Tools/Paint_Flashing_Tool">Highlight painted area</a></li> - <li><a href="/en-US/docs/Tools/3D_View">3D view</a></li> - <li><a href="/en-US/docs/Tools/Scratchpad">Scratchpad</a></li> - <li><a href="/en-US/docs/Tools/Eyedropper">Grab a color from the page</a></li> - <li>Take a full-page screenshot: this is new in Firefox 32. It takes a screenshot of the complete web page and saves it in your Downloads directory</li> - <li><a href="/en-US/docs/tools/Working_with_iframes">Select a frame as the currently targeted document</a>: this is new in Firefox 34.</li> -</ul> -<h3 id="Toolbox_controls">Toolbox controls</h3> -<p>Finally there's a row of buttons to:</p> -<ul> - <li>close the window</li> - <li>toggle the window between attached to the bottom of the browser window, and attached to the side of the browser window</li> - <li>toggle the window between standalone and attached to the browser window</li> - <li>access <a href="#Settings" title="#Settings">developer tool settings</a></li> -</ul> -<h2 id="Settings_2"><a name="Settings">Settings</a></h2> -<p>Clicking the "Settings" button (<img alt="" src="https://mdn.mozillademos.org/files/8623/settings-cog-small.png" style="width: 30px; height: 22px; display: inline-block;">) gives you access to settings for the Toolbox itself and for the tools it hosts:</p> -<p><img alt="" src="https://mdn.mozillademos.org/files/8619/devtools-settings.png" style="display: block; margin-left: auto; margin-right: auto;"></p> -<h3 id="Default_Firefox_Developer_Tools">Default Firefox Developer Tools</h3> -<p>This group of checkboxes determines which tools are enabled in the toolbox. New tools are often included in Firefox but not enabled by default.</p> -<h3 id="Available_Toolbox_Buttons">Available Toolbox Buttons</h3> -<p>This group of checkboxes determines which "standalone tools" get buttons in the <a href="/en-US/docs/Tools_Toolbox#Toolbar">toolbar</a>. This defaults to the node picker, the split console, and responsive design mode.</p> -<p>Firefox 32 adds a button to take a screenshot of the complete web page, which is unchecked by default.</p> -<h3 id="Choose_DevTools_theme">Choose DevTools theme</h3> -<p>This enables you to switch between a light and a dark theme:</p> -<p><img alt="" src="https://mdn.mozillademos.org/files/6933/light-theme.png" style="display: block; margin-left: auto; margin-right: auto;"><img alt="" src="https://mdn.mozillademos.org/files/6931/dark-theme.png" style="display: block; margin-left: auto; margin-right: auto;"></p> -<h3 id="Common_preferences">Common preferences</h3> -<p>Settings that apply to more than one tool. There's just one of these:</p> -<ul> - <li><em>Enable persistent logs</em>: a setting to control whether or not the Web Console and Network Monitor clear their output when you navigate to a new page.</li> -</ul> -<h3 id="Inspector">Inspector</h3> -<ul> - <li><em>Show browser styles</em>: a setting to control whether styles applied by the browser (<a href="/en-US/docs/Web/CSS/Cascade">user-agent styles</a>) should be displayed in the Inspector's <a href="/en-US/docs/Tools/Page_Inspector#Rules_view">Rules view</a>. This setting is new in Firefox 32. Note that this setting is independent of the "Browser styles" checkbox in the Inspector's <a href="/en-US/docs/Tools/Page_Inspector#Computed_view">Computed view</a>.</li> - <li><em>Default color unit</em>: a setting to control how colors are represented in the inspector: - <ul> - <li>Hex</li> - <li>HSL(A)</li> - <li>RGB(A)</li> - <li>name.</li> - </ul> - </li> -</ul> -<h3 id="Web_Console">Web Console</h3> -<ul> - <li><em>Enable timestamps</em>: controls whether the Web Console displays timestamps. From Firefox 28 the Web Console defaults to hiding timestamps.</li> -</ul> -<h3 id="Style_Editor">Style Editor</h3> -<ul> - <li><em>Show original sources</em>: when a CSS preprocessor supporting source maps is used, this enables the Style Editor to display the original, preprocessor, sources rather than the generated CSS. <a href="/en-US/docs/Tools/Style_Editor#Source_map_support">Learn more about Style Editor support for CSS source maps</a>. With this setting checked, the <a href="/en-US/docs/Tools/Page_Inspector#Link_to_CSS_file">Page Inspector Rules view will also provide links to the original sources</a>.</li> - <li><em>Autocomplete CSS</em>: enable the Style Editor to offer <a href="/en-US/docs/Tools/Style_Editor#Autocomplete">autocomplete suggestions</a>.</li> -</ul> -<h3 id="JavaScript_Profiler">JavaScript Profiler</h3> -<ul> - <li><em>Show Gecko platform data</em>: a setting to control whether or not profiles should include Gecko platform symbols.</li> -</ul> -<h3 id="Editor_Preferences">Editor Preferences</h3> -<p>Preferences for the <a href="http://codemirror.net/">CodeMirror</a> source editor, which is included in Firefox and used by several developer tools, including <a href="/en-US/docs/Tools/Scratchpad">Scratchpad</a> and the <a href="/en-US/docs/Tools/Style_Editor">Style Editor</a>.</p> -<ul> - <li><em>Detect indentation</em>: auto-indent new lines based on the current indentation</li> - <li><em>Autoclose brackets</em></li> - <li><em>Indent using spaces</em></li> - <li><em>Tab size</em></li> - <li><em>Keybindings</em>: choose the default CodeMirror keybindings, or keybindings from one of several popular editors: - <ul> - <li>Vim</li> - <li>Emacs</li> - <li>Sublime Text</li> - </ul> - </li> -</ul> -<h3 id="Advanced_settings">Advanced settings</h3> -<ul> - <li><em>Disable cache</em>: disable the browser cache to simulate first-load performance. From Firefox 33 onwards this setting persists, meaning that if it is set, caching will be disabled whenever you reopen the devtools. Caching is re-enabled when the devtools are closed.</li> - <li><em>Disable JavaScript</em>: reload the current tab with JavaScript disabled</li> - <li><em>Enable chrome debugging</em>: enable you to use developer tools in the context of the browser itself, and not only web content</li> - <li><em>Enable remote debugging</em>: enable the developer tools to <a href="/en-US/docs/Tools/Remote_Debugging">debug remote Firefox instances</a></li> -</ul> -<h2 id="Main_Pane">Main Pane</h2> -<p>The content of the main pane in the window is entirely controlled by, and specific to, the hosted tool currently selected.</p> diff --git a/files/pl/tools/view_source/index.html b/files/pl/tools/view_source/index.html deleted file mode 100644 index 206d54d7da..0000000000 --- a/files/pl/tools/view_source/index.html +++ /dev/null @@ -1,83 +0,0 @@ ---- -title: View Source -slug: Tools/View_source -translation_of: Tools/View_source -original_slug: Narzędzia/View_source ---- -<div>{{ToolsSidebar}}</div> - -<p>View Source lets you look at the HTML or XML source for the page you're viewing. To activate View Source:</p> - -<ul> - <li>context-click in the page and select <em>View Page Source</em></li> - <li>press <kbd>Ctrl</kbd> + <kbd>U</kbd> on Windows and Linux, or <kbd>Cmd</kbd> + <kbd>U</kbd> on macOS</li> -</ul> - -<p>The command opens a new tab with the source for the current page.</p> - -<h2 id="View_Source_features">View Source features</h2> - -<p>View Source has three additional features, which can be accessed from the context menu in the View Source tab:</p> - -<p><img alt="" src="https://mdn.mozillademos.org/files/16909/view_source_context_menu.png" style="display: block; height: 359px; margin: 0 auto; width: 225px;"></p> - -<dl> - <dt>Go to Line</dt> - <dd>Scrolls to the specified line. If the number is higher than the lines in a file, you receive an error message.</dd> - <dt>Wrap Long Lines (toggle)</dt> - <dd>Wraps long lines to the width of the page.</dd> - <dt>Syntax Highlighting (toggle)</dt> - <dd>Applies syntax highlighting to the code.When syntax highlighting is on, View Source also highlights parsing errors in red. Hovering your mouse over errors displays a tooltip explaining the error.</dd> -</dl> - -<p><img alt="" src="https://mdn.mozillademos.org/files/16910/view_source_error.png" style="border: 1px solid black; display: block; margin: 0 auto;"></p> - -<p>This feature is useful when you're looking for HTML errors.</p> - -<p>To access Go to Line from the keyboard, press <kbd>Control</kbd> + <kbd>Option</kbd> + <kbd>L</kbd> on macOS, or <kbd>Alt</kbd> + <kbd>Shift</kbd> + <kbd>L</kbd> on Windows or Linux.</p> - -<h2 id="Link_to_a_line_number">Link to a line number</h2> - -<p>It is possible to link to a particular line, by adding the #lineNNN anchor to the url the browser will jump to the NNN line.</p> - -<p>For example <a>view-source:https://www.mozilla.org/#line100</a></p> - -<h2 id="View_Selection_Source">View Selection Source</h2> - -<p>If you select part of a web page and conext-click, you'll see a context menu item labeled "View Selection Source", that behaves just like "View Page Source", except you only see the source for the selection.</p> - -<h2 id="View_MathML_Source">View MathML Source</h2> - -<p>If you context-click while the mouse is over some <a href="/en-US/docs/Web/MathML">MathML</a>, you'll see a context menu item labeled "View MathML Source": click it to see the MathML source.</p> - -<h2 id="Limitations_of_View_Source">Limitations of View Source</h2> - -<p>There are limitations to what View Source does for you that you need to be aware of.</p> - -<h3 id="Error_reporter_≠_validator">Error reporter ≠ validator</h3> - -<p>View Source only reports parsing errors, <strong>not</strong> HTML validity errors. For example, putting a {{ HTMLElement("div") }} element as a child of a {{ HTMLElement("ul") }} element isn't a parse error, but it <strong>is not</strong> valid HTML. Therefore, this error will not be flagged in View Source. If you want to check that HTML is valid, you should use an HTML validator, such as <a class="external" href="http://validator.w3.org/" title="http://validator.w3.org/">the one offered by W3C</a>.</p> - -<h3 id="Not_all_parse_errors_are_reported">Not all parse errors are reported</h3> - -<p>Even though all the reported errors are parse errors according to the HTML specification, not all parse errors are reported by View Source. Among the errors that don't get reported:</p> - -<ul> - <li>Bytes that are illegal according to the document's encoding aren't marked as errors.</li> - <li>Forbidden characters aren't reported as errors.</li> - <li>Errors related to the end-of-file aren't reported.</li> - <li>Tree builder errors relating to text (as opposed to tags, comments, or doctypes) aren't reported.</li> - <li>Parse errors related to <code>xmlns</code> attributes aren't reported.</li> -</ul> - -<h2 id="XML_syntax_highlighting">XML syntax highlighting</h2> - -<p>View Source uses the HTML tokenizer when highlighting XML source. While the tokenizer has support for processing instructions when highlighting XML source, that's the only XML-specific capability provided. Because of this, doctypes that have an internal subset are not highlighted correctly, and entity references to custom entities are also not highlighted correctly.</p> - -<p>This mishighlighting can be seen by viewing the source of Firefox chrome files (such as XUL documents). However, this shouldn't be a problem in practice when viewing typical XML files.</p> - -<h2 id="See_also">See also</h2> - -<ul> - <li><a class="external" href="http://hsivonen.iki.fi/view-source/" title="http://hsivonen.iki.fi/view-source/">HTML5 Parser-Based View Source Syntax Highlighting</a> (Blog post)</li> -</ul> |