The "Network" tab in Firefox does not display AJAX requests made from a content script

I'm currently working on my first web extension, but I've encountered some difficulties with web requests. Whenever I make an AJAX request or any other type of request, it doesn't seem to appear in the "Network" tab.

I've been monitoring both the network tab of the application and the network tab in the add-on debug window.

$.ajax({
        url: 'https://steamcommunity.com/market/sellitem/',
        type: 'POST',
        data: {
            // data here
        },
        crossDomain: true,
        xhrFields: { withCredentials: true }
    }).done(function (data) {
        // handler here
    }).fail(function (jqxhr) {
        // handler here
    });

Even though I can see the request ending in 400 when I pause at a breakpoint in the "fail" branch and check the jqxhr variable, I really want to be able to compare the requests in the network tab to identify the issue.

Edit 1: The permissions in my manifest.json file are as follows:

"permissions": [
        "*://steamcommunity.com/market/*",
        "webRequest"
    ],

Answer №1

During my experimentation, I conducted tests involving requests triggered from a popup linked to a browser_action, but strangely, the requests did not display in the "Debug" console accessed through the "about:debugging" page.

https://i.sstatic.net/3ecJ4.png

I am unsure whether this occurrence is intentional or a potential bug. Like yourself, I anticipated the network calls to be logged in the debugging console.


Despite this, I was able to view the requests made from my addon popup by launching the universal browser toolbox, which is not exclusive to your specific extension (allowing you to observe output from other addons as well).

You can access it through the

Tools > Web developer > Browser toolbox
menu. Here, you will be able to visualize the requests triggered by the extension:

https://i.sstatic.net/WZYXq.png


It is worth mentioning that the issue 1410357 on bugzilla appears to be linked to this particular behavior.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Node.js Error: The requested URL cannot be found

I have encountered an issue in my Node project where I am getting a 'Cannot GET/' error when trying to open localhost on port 8081. I suspect that the problem lies in correctly reading the HTML file, but I'm not entirely sure. var express = ...

Issue with data interpretation between jQuery and Java

My character encoding is currently set to ISO-8859-1. I'm utilizing an AJAX call with jQuery.ajax to communicate with a servlet. After serialization by jQuery, the URL appears as follows: https://myurl.com/countryAndProvinceCodeServlet?action=getPro ...

What is the best way to pass a variable between clusters in a Node.js application?

I have implemented clusters in my express application, where the master node has a caching system with a variable that needs to be shared across worker nodes. I am looking for a way to achieve this without using a physical datastore. Can the following ap ...

Exploring Checkbox Limiting with jQuery

Is there a more efficient approach to restrict the selection of checkboxes? I want the script to be adaptable depending on the applied class, which will always indicate the maximum allowed value (e.g., "limit_1" or "limit_2"). Currently, I'm creatin ...

Tips on retrieving complete information from mongoose when the schema contains a reference

I have a schema that includes [content, name, email], and I need to retrieve all three data fields and render them on the frontend simultaneously. Can you provide an example of JavaScript code that accomplishes this? const UserSchema = new mongoose.Schem ...

The pop-up window is currently inactive

Utilizing the following example, I successfully created a modal window: jsfiddle The modal window allows me to display data from a table. Here is a snippet of my code: <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bulma/0.7.1/c ...

In order to achieve a sliding effect for the second div, it can be programmed to

Currently, I am working on implementing hide and show functionality in my project. However, I have come across a bug in my code that I need assistance with. When clicking on the first div element, the content opens from bottom to top instead of the desired ...

Contrast in functionality between a pair of variables within a controller

Could you please clarify the distinction between two variables a1 and a2: app.controller("someCtrl",function(){ this.a1=somevalue; var a2=somevalue; }); Also, can you explain the lifespan of variable a2? ...

What is the best way to customize the style of a react.js component upon its creation?

Is there a way to set the style of a react.js component during its creation? Here is a snippet of my code (which I inherited and simplified for clarity) I want to be able to use my LogComponent to display different pages of a Log. However, in certain ins ...

Guide on invoking Objective-C function from JavaScript on iOS

I'm currently working on integrating Highchart into an iOS app. I have a requirement where I need to pass values from JavaScript (HTML file) to an Objective-C method. For example, when a user zooms in on the chart displayed in a UIWebView using Highch ...

What benefits do Adobe Creative Cloud apps offer for developing interactive content in AEM?

My client recently transitioned to AEM for their website, and we are tasked with creating an interactive HTML5 'component' to be embedded on a page. While we have previously used custom HTML5 for components, integrating them into pages on the old ...

What is the best way to retrieve an element made in a different function within JavaScript?

I have a main button on the screen and when I click that button, it generates two more buttons. These additional buttons should each have their own functionality and click events, but since they are created within a function without global variables or ids ...

Error: Unable to define $scope function in Angular and Jasmine integration

I am currently working with a controller var videoApp = angular.module('videoApp', ['videoAppFilters', 'ui.unique', 'angularUtils.directives.dirPagination']); videoApp.controller('VideoCtrl', function ($sc ...

Use JavaScript Ajax to call a PHP function and retrieve database data

I am attempting to invoke a PHP function using Ajax. Below is the JavaScript code present in my HTML file: <script type="text/javascript"> function ajax(){ $.ajax({ type:"POST", url: "SQLCommunication.php", ...

Enhancing user experience with AngularJS: Harnessing ng-Click for seamless task management on display pages

I'm struggling with my TodoList in AngularJS. I need help creating the ngClick function for the "addTodo" button. My goal is to send the entire form data to another page where I can display the tasks. Can someone guide me on what needs to be added to ...

Mongoose is struggling to locate the expected result

I currently have three different schemas set up. User.js: const mongoose = require("mongoose"); const bcrypt = require("bcryptjs"); const userSchema = new mongoose.Schema({ name: { type: String, required: true, }, email: { type: String, ...

"Reacting to click events, all buttons have been successfully updated in ReactJS

When a button is clicked, all buttons are updated simultaneously. However, I am looking to only change the state of the specific button that is clicked. Please refer to the image links and code provided below. import React from 'react'; import & ...

Direct the user to a webpage with the option for postback functionality or caching

I'm encountering an issue on my webforms site with 2 menus. When a button is clicked on a page, it triggers some C# events through a webservice (ajax) and then redirects to another page using history.go(-1). The problem arises when I create a session ...

Is there a way to automatically calculate the sum of two boxes and display the result in a separate

I am working with two boxes: one is called AuthorizedAmount and the other is called LessLaborToDate: <div class="col-md-6"> <div class="form-group"> <label>Authorized Amount</label> <div class="input-group"> & ...

Distinguishing between a video or image when uploading files in JavaScript

I've been researching whether JavaScript can determine if a file is a video or an image. However, most of the information I found only shows how to accept these types using the input tag. What I really need is for JS to identify the file type and the ...