fix edge case in migration; update manifest to version 3

src/background/migrate/__tests__/migrate-old-format.test.js

@@ -31,7 +31,7 @@ describe('MigrateOldFormat', () => {
  expect(mockSet).toHaveBeenCalledTimes(0);
  });
 
- it('returns styles as is when they are already in the new format', async () => {
+ it('returns styles as is when they are in the new format', async () => {
  const mockSet = jest.fn((_, callback) => callback());
  const mockGet = (_, callback) => {
  callback({ styles: newFormat });
@@ -43,6 +43,26 @@ describe('MigrateOldFormat', () => {
  expect(mockSet).toHaveBeenCalledTimes(0);
  });
 
+ it('returns styles as is when they are in the new format (with empty css)', async () => {
+ const newFormatWithEmptyCss = {
+ 'www.google.com': {
+ css: '',
+ enabled: false,
+ readability: false,
+ },
+ };
+
+ const mockSet = jest.fn((_, callback) => callback());
+ const mockGet = (_, callback) => {
+ callback({ styles: newFormatWithEmptyCss });
+ };
+ mockChromeAPI(mockGet, mockSet);
+
+ const styles = await getMigratedStyles();
+ expect(styles).toEqual(newFormatWithEmptyCss);
+ expect(mockSet).toHaveBeenCalledTimes(0);
+ });
+
  it('backs up v2 styles to "backup_v2_styles"', async () => {
  const mockSet = jest.fn((_, callback) => callback());
  const mockGet = (_, callback) => {

src/background/migrate/migrate-old-format.ts

@@ -5,7 +5,7 @@ import { Style, StyleMap, StylebotOptions } from '@stylebot/types';
 /* eslint-disable-next-line @typescript-eslint/no-explicit-any */
 const isNewFormat = (styles: any) => {
  const urls: Array<string> = Object.keys(styles);
- return !!urls.find(url => !!styles[url].css);
+ return !!urls.find(url => styles[url].css !== undefined);
 };
 
 /* eslint-disable-next-line @typescript-eslint/no-explicit-any */
@@ -20,28 +20,28 @@ const backupV2Styles = (styles: any) => {
 export const getMigratedStyles = (): Promise<StyleMap> => {
  return new Promise(resolve => {
  chrome.storage.local.get('styles', async items => {
- const oldStyles = items['styles'];
+ const styles = items['styles'];
 
- if (!oldStyles) {
+ if (!styles) {
  resolve({});
  return;
  }
 
- // test to ensure styles are not already in the new format
- if (isNewFormat(oldStyles)) {
- resolve(oldStyles);
+ // check if styles are in the new format
+ if (isNewFormat(styles)) {
+ resolve(styles);
  return;
  }
 
  // backup old styles, in case we run into a bug
- await backupV2Styles(oldStyles);
+ await backupV2Styles(styles);
 
  const formatter = new LegacyCssFormatter();
- const urls: Array<string> = Object.keys(oldStyles);
+ const urls: Array<string> = Object.keys(styles);
 
  const results: Array<Promise<Style>> = urls.map(
  async (url): Promise<Style> => {
- const style = oldStyles[url];
+ const style = styles[url];
 
  return new Promise(resolveStyle => {
  try {
@@ -67,13 +67,13 @@ export const getMigratedStyles = (): Promise<StyleMap> => {
  );
 
  Promise.all(results).then(formattedStyles => {
- const styles: StyleMap = {};
+ const newStyles: StyleMap = {};
 
  formattedStyles.forEach(({ url, css, enabled, readability }) => {
- styles[url] = { css, enabled, readability };
+ newStyles[url] = { css, enabled, readability };
  });
 
- resolve(styles);
+ resolve(newStyles);
  });
  });
  });

src/editor/components/header/TheDeleteStyleDialog.vue

@@ -51,6 +51,7 @@ export default Vue.extend({
  height: 100%;
  overflow: hidden;
  outline: 0;
+ line-height: 24px;
  background: #000000b3;
 }
 

src/extension/manifest.json

@@ -1,8 +1,8 @@
 {
  "manifest_version": 2,
  "name": "Stylebot",
- "version": "2.4.1",
- "description": "Change the appearance of websites instantly.",
+ "version": "3",
+ "description": "Change the appearance of the web instantly",
 
  "background": {
  "scripts": ["background/index.js"]