Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Extend HTML mode - persist checkbox value and use across views #135

Open
wants to merge 22 commits into
base: master
Choose a base branch
from
Open

Extend HTML mode - persist checkbox value and use across views #135

Show file tree
Hide file tree
Changes from 3 commits
Commits
Show all changes
22 commits
Select commit Hold shift + click to select a range
c265a36
Trimmed the extra white space when creating html
irenejoeunpark Nov 25, 2021
47c775d
Trimmed extra white space when creating html code
irenejoeunpark Nov 25, 2021
6272f5f
Store asHtml value whenever clicked
irenejoeunpark Nov 26, 2021
f02facf
Update README.md
MichaelCurrin Nov 24, 2021
214ae5a
Update usage.md
MichaelCurrin Nov 24, 2021
396fd7a
Update installation.md
MichaelCurrin Nov 24, 2021
5ed970c
Update installation.md
MichaelCurrin Nov 24, 2021
5ccdb35
refactor: update catalogue.ts
MichaelCurrin Nov 24, 2021
bad18eb
refactor: split type
MichaelCurrin Nov 24, 2021
4617a28
update Repo.ts
MichaelCurrin Nov 24, 2021
b295a89
update RepoBadges.vue
MichaelCurrin Nov 24, 2021
cef1bc5
update Repo.ts
MichaelCurrin Nov 24, 2021
55005b2
test: update Repo.spec.ts with case
MichaelCurrin Nov 24, 2021
802e055
test: update Repo.spec.ts with _documentationSectionMd case
MichaelCurrin Nov 24, 2021
aec5ecf
style: update Repo.ts and Repo.spec.ts
MichaelCurrin Nov 24, 2021
16537bb
Update upgrading.md
MichaelCurrin Nov 24, 2021
05fce81
style: update Code.vue
MichaelCurrin Nov 26, 2021
04572d6
docs: update markdown.ts
MichaelCurrin Nov 26, 2021
2c015aa
docs: update store.ts
MichaelCurrin Nov 26, 2021
f399c8b
update Code.vue
MichaelCurrin Nov 26, 2021
ff21dff
refactor: rename
MichaelCurrin Nov 26, 2021
6a77c0b
Merge branch 'master' of github.com:MichaelCurrin/badge-generator int…
MichaelCurrin Nov 26, 2021
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
6 changes: 4 additions & 2 deletions src/components/Code.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -14,6 +14,8 @@ import { defineComponent } from "vue";

import { cleanHtml, mdToHTML } from "@/core/markdown";
import Checkbox from "./Checkbox.vue";
import store from "@/store";


export default defineComponent({
name: "Code",
Expand All @@ -25,14 +27,14 @@ export default defineComponent({
},
data() {
return {
asHtml: false,
asHtml: store.state.asHtml,
};
},
computed: {
outputCode(): String {
store.setAsHTML(this.asHtml);
if (this.asHtml) {
const htmlCode = mdToHTML(this.code);

return cleanHtml(htmlCode);
}
return this.code;
Expand Down
2 changes: 1 addition & 1 deletion src/core/markdown.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -68,7 +68,7 @@ export function mdImageWithLink({
* Render Markdown code as HTML code.
*/
export function mdToHTML(value: string): string {
return md.render(value);
return md.render(value).trim();
}

/**
Expand Down
13 changes: 13 additions & 0 deletions src/store.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,7 @@
import { DEBUG } from "@/constants/";
import { DEFAULT_REPO_INPUTS } from "@/constants/badgeValues";
import { reactive } from "vue";
// import asHtml from "@/components/Code.vue";
MichaelCurrin marked this conversation as resolved.
Show resolved Hide resolved

/**
* Global store.
Expand All @@ -14,6 +15,7 @@ const store = {
state: reactive({
repoUsername: DEFAULT_REPO_INPUTS.username,
repoName: DEFAULT_REPO_INPUTS.repoName,
asHtml: false,
}),

/**
Expand All @@ -37,6 +39,17 @@ const store = {

this.state.repoName = value;
},

/**
* Store asHtml value. e.g. true or false.
*/
setAsHTML(value: boolean){
if (DEBUG) {
console.debug(`Storing asHtml as: ${value}`);
}

this.state.asHtml = value;
}
};

export default store;
2 changes: 2 additions & 0 deletions tests/unit/components/Code.spec.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,5 +1,7 @@
import Code from "@/components/Code.vue";
import { shallowMount } from "@vue/test-utils";
import store from "@/store";
MichaelCurrin marked this conversation as resolved.
Show resolved Hide resolved
Copy link
Owner

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This bit needs to be actually used.

Also please run tests and fix them. The Code component needs to switch between HTML and Markdown mode in the tests.

This file is failing.

This old code is like this:

      data() {
        return {
          asHtml: true,
        };
      },

I tried adding this and it didn't work.


    wrapper.setData({ asHtml: true })
    store.setAsHtml(true)


Copy link
Owner

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change


describe("Code.vue", () => {
it("renders a Markdown codeblock as Markdown code, with highlighting", () => {
Expand Down