centersl/chrome-extensions-samples
1
0
Fork 0
mirror of https://github.com/GoogleChrome/chrome-extensions-samples.git synced 2026-03-27 13:29:34 +07:00
Code Issues Packages Projects Releases Wiki Activity

Add DevTools Tips example (#1013)

Browse Source 
* Add DevTools Tips example

* Update functional-samples/tutorial.focus-mode-debugging/README.md

Co-authored-by: Joe Medley <jmedley@google.com>

---------

Co-authored-by: Joe Medley <jmedley@google.com>
This commit is contained in:
Oliver Dunk
2023-09-29 20:03:57 +01:00
committed by GitHub
parent c12328728d
commit a1c97b522e
11 changed files with 219 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

44
functional-samples/tutorial.focus-mode-debugging/fixed/background.js Normal file
View File

@@ -0,0 +1,44 @@
// Copyright 2023 Google LLC
//
// Licensed under the Apache License, Version 2.0 (the "License");
// you may not use this file except in compliance with the License.
// You may obtain a copy of the License at
//
// https://www.apache.org/licenses/LICENSE-2.0
//
// Unless required by applicable law or agreed to in writing, software
// distributed under the License is distributed on an "AS IS" BASIS,
// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
// See the License for the specific language governing permissions and
// limitations under the License.
chrome.runtime.onInstalled.addListener(() => {
chrome.action.setBadgeText({
text: 'OFF'
});
});
const extensions = 'https://developer.chrome.com/docs/extensions';
const webstore = 'https://developer.chrome.com/docs/webstore';
// When the user clicks on the extension action
chrome.action.onClicked.addListener(async (tab) => {
if (tab.url?.startsWith(extensions) || tab.url?.startsWith(webstore)) {
// We retrieve the action badge to check if the extension is 'ON' or 'OFF'
const prevState = await chrome.action.getBadgeText({ tabId: tab.id });
// Next state will always be the opposite
const nextState = prevState === 'ON' ? 'OFF' : 'ON';
// Set the action badge to the next state
await chrome.action.setBadgeText({
tabId: tab.id,
text: nextState
});
if (nextState === 'ON') {
chrome.tabs.sendMessage(tab.id, { data: 'focus-on' });
} else if (nextState === 'OFF') {
chrome.tabs.sendMessage(tab.id, { data: 'focus-off' });
}
}
});

24
functional-samples/tutorial.focus-mode-debugging/fixed/focus-mode.js Normal file
View File

@@ -0,0 +1,24 @@
// Copyright 2023 Google LLC
//
// Licensed under the Apache License, Version 2.0 (the "License");
// you may not use this file except in compliance with the License.
// You may obtain a copy of the License at
//
// https://www.apache.org/licenses/LICENSE-2.0
//
// Unless required by applicable law or agreed to in writing, software
// distributed under the License is distributed on an "AS IS" BASIS,
// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
// See the License for the specific language governing permissions and
// limitations under the License.
chrome.runtime.onMessage.addListener((msg) => {
switch (msg.data) {
case 'focus-on':
document.body.setAttribute('data-focus-mode', 'on');
break;
case 'focus-off':
document.body.removeAttribute('data-focus-mode');
break;
}
});