How do I actually set DefaultTabs in a Spotify app? - json

The integration guidlines for the Spotify Apps API mentions DefaultTabs and how it should be expressed in the manifest.json file to achieve tabbing in your Spotify app. Unfortunately I have problem getting this to work and the app that it refers to (Tabs, with the URI spotify:app:tabs) for example doesn't exist in my preview build of the Spotify application.
The application can specify what tabs it wants in the manifest file, in the DefaultTabs attribute. The attribute must be a list of records. Each record must contain the attributes arguments and title. The title can, and should, be localized by making it into a record with attributes for each language (currently en, fr and es).
I have tried the following:
Adding this snippet to my manifest.json file:
"DefaultTabs": [{
arguments: [],
title: {"en": "På TV4"}
}
]
Quitting the Spotify application and reloading it.
Load my app by entering it's address spotify:app:name in the address field.
Here I expected to see the tabs loaded, but it wasn't. Any help with the correct syntax would be appreciated.

I had a few issues at first too, but the following snippet works for me:
"DefaultTabs": [
{
"arguments": "test",
"title": { "en": "test" }
},
{
"arguments": "test2",
"title": { "en": "test2" }
}
]
I think you are probably missing the arguments.
Also check out the Kitchensink demo app and sourcecode in GitHub: https://github.com/ptrwtts/kitchensink

Related

Have Schemas in Redoc side menu

Redoc is a great tool, but I'm struggling to understand how it works. Currently I've been tasked with copying some docs from api-docs.io to be self served using redoc.
However, my issue is that the schemas aren't appearing in the side bar as they do on the api-docs site. I'm not sure how I can get models to show on the side as well... And I'm fairly new to api documentation. You can also check out how the models are displayed here. And see another example below.
I've taken a look to see if this is a feature of redoc and came across this merged PR which (based on the discussion in the PR's issue) states that we should add an html element, SchemaDefinition. I am using the basic html file (suggested in the readme of the redoc repo), but we want to use a json schema (which is referenced with spec-url) to render the docs on redoc so I'm struggling to understand how I can manipulate the side bar using just the html element.
Maybe it's just my understanding of how redoc works that is lacking. If you feel that's the case, a quick explanation would be wonderful.
You have to modify the json with additional information.
Sample json (without sidebar model section): https://petstore3.swagger.io/api/v3/openapi.json
Add to "tags" array
{
"name": "pet_model",
"description": <SchemaDefinition schemaRef="#/components/schemas/Pet" />,
"x-displayName": "Pet"
},
{
"name": "user_model",
"description": <SchemaDefinition schemaRef="#/components/schemas/User" />,
"x-displayName": "User"
}
Then to group the sidebar add the x-tagGroups extension
...
"tags": [...],
"x-tagGroups": [{
"name": "Api",
"tags": ["pet", "store", "user"]
},
{
"name": "Models",
"tags": ["pet_model", "user_model"]
}],
"paths": ...

Chrome extension can not access custom window properties

Im trying to write a Chrome extension that has a dev tools panel. This extension needs to call functions defined on a property on window in a webpage that I also have made. In other words, the extension is only for my own web page and I control both. Example:
// This script is added in my own webpage application when it loads
window.myTest = () => { /* do something */ }
I want to be able to call the function window.myTest from my Chrome extension. I need to make similar functionality like https://github.com/zalmoxisus/redux-devtools-extension.
It seems that I need to do this by inject script/code from my backend page. I have all working, extension with backend page that gets invoked and I can see that the code that I inject gets called in the page context (testing by console.log gets written to the console output of the page).
Here is my code:
manifest.json
{
"manifest_version": 2,
"name": "MyTest",
"description": "MyTest",
"version": "0.0.1",
"minimum_chrome_version": "10.0",
"devtools_page": "devtools.html",
"background": {
"scripts": ["background.js"]
},
"content_scripts": [{
"matches": ["<all_urls>"],
"js": ["testscript.js"]
}],
"permissions": [
"tabs",
"<all_urls>"
]
}
testscript.js
window.myTest(); // myTest is undefined in the context of the injected script
background.js
// empty, but here to be able to open background page
I also have a pannel that sends a message to the background page when a button is clicked. I know that the panel and sending the message also work. But window.myTest is still undefined.
Edit
Removed the injection from background.js, because I did not use it and have same issue as described.
Finally, I got the specs on this. Mozilla and Chrome follow the same specs for extensions.
Content scripts get a "clean" view of the DOM. This means:
Content scripts cannot see JavaScript variables defined by page
scripts.
If a page script redefines a built-in DOM property, the
content script sees the original version of the property, not the
redefined version.
https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/Content_scripts

Chrome Packaged app communication with webpage

I have used chrome packaged app that Chrome-Serial-App-master
enter link description here
Manifest
"app": {
"background": {
"scripts": [
"main.js"
]
}
},
"permissions": [
"serial"
]
I want to receive value from packaged app to my website at text box area
Can I access my webpage Dom ?
or use message passing?
Not sure I understand the question, but you can use XMLHttpRequest to read the HTML of any webpage and then display that by setting the innerHTML property of some element.
You can use message passing. You can use chrome.runtime.onMessageExternal or chrome.runtime.onConnectExternal chrome APIs for this purpose.

Chrome Extensions i18n: Redirecting to locale-specific content

Question: How can I redirect users to most-relevant content, sitting in 3 different sub-directories, depending on their preferred language?
What I have
I have created 3 different _locales sub-directories, each containing language-specific messages.json files:
_locales/en/messages.json
_locales/en_GB/messages.json
_locales/de/messages.json
In manifest.json in the root directory, this already works well and as expected to correctly adapt the extension's name and description in the respective language, using:
manifest.json
{
"manifest_version": 2,
"name": "__MSG_extensionName__",
"description": "__MSG_extensionDescription__",
"version": "1.0",
"default_locale": "en",
"browser_action": {
"default_title": "__MSG_extensionName__",
"default_icon": "icon.png",
"default_popup": "popup.html"
}
}
Where I am stuck
As the user clicks on my extension's icon, I also want to load language-specific content from the most-relevant sub-directory -- instead of the "default_popup": "popup.html" line -- because some URLs that I link to from the popup.html files also differ by language:
_locales/en/popup.html
_locales/en_GB/popup.html
_locales/de/popup.html
So I thought the best way to do it is to exchange that one line from my root manifest.json that currently reads
"default_popup": "popup.html"
with a line that reads
"default_popup": "__MSG_initialContent__"
and then within each of the _locales sub-directories' messages.json files have
"initialContent": {
"message": "popup.html"
}
so that it reads the content locally from within that subdirectory.
BUT: That is where it all falls apart. Then I get a "This webpage is not found error".
I have tried, to no avail, these differing variations (examples below for _locales/de/messages.json) -- all leading to the same error message:
"initialContent": {
"message": "popup.html"
}
then
"initialContent": {
"message": "_locales/de/popup.html"
}
then
"initialContent": {
"message": "/de/popup.html"
}
and lastly
"initialContent": {
"message": "de/popup.html"
}
What am I doing wrong?
Thanks!
I know this question is very old but I just found it and I guess it would be nice for future visitors to get a solution.
What you need to achieve this are "Predefined messages"
Quote:
Predefined messages
The internationalization system provides a few predefined messages to help you localize. These include ##ui_locale, so you can detect the current UI locale, ...
[...]
The special message ##extension_id can be used in the CSS and JavaScript files, whether or not the extension or app is localized. This message doesn't work in manifest files.
The following table describes each predefined message.
##extension_id
The extension or app ID; you might use this string to construct URLs for resources inside the extension. Even unlocalized extensions can use this message.
Note: You can't use this message in a manifest file.
##ui_locale The current locale; you might use this string to construct locale-specific URLs.
[...]

Create an alert every page load with Chrome extension

This is my first time messing around with extensions and what I am trying to do is very simple yet I can't seem to get it to work.
I simply want an alert to be called every time a page on google is loaded.
In my manifest.json I have:
{
"name": "Bypass shib",
"version": "1.0",
"content_scripts": [
{
"matches": ["http://www.google.com/*"],
"js": ["secondScript.js"]
}
],
"manifest_version": 2
}
Okay now in my secondScript.js I have:
chrome.tabs.executeScript(null, {code: "alert('test')"});
Shouldn't this execute the alert whenever a page is loaded? If not can somebody explain why it's not?
The console reveals the following message:
Uncaught Error: "executeScript" can only be used in extension processes.
See the content scripts documentation for more details.
This post suggests "Chrome extension functions cannot be used in content scripts," which could be what you're running into.
For completeness, the secondScript.js that worked for me was as follows:
console.log("test");
//chrome.tabs.executeScript(null, {code: "alert('test')"});
alert("test");
Content scripts do not have access to any of the chrome.tabs.* API methods.
To display an alert on every page, remove the chrome.tabs.executeScript method, and let your secondScript.js just contain:
alert('Test');
In a Chrome extension, there are three different kinds of scopes in which JavaScript can run. The understanding of this separation is essential for writing Chrome extensions, see this answer.