Closed Bug 1426507 Opened 3 years ago Closed 3 years ago

Upgrade BMO to HTML5

Categories

(bugzilla.mozilla.org :: General, enhancement)

Production
enhancement
Not set
normal

Tracking

()

RESOLVED FIXED

People

(Reporter: kohei.yoshino, Assigned: fatehsandhu, Mentored)

References

Details

(Keywords: good-first-bug)

Attachments

(2 files)

The HTML source of https://bugzilla.mozilla.org/ is still mostly from the HTML4 era. To upgrade to HTML5, we need many changes including but not limited to:

* Simplify charset
* Use <main> for #bugzilla-body
* Remove type="text/javascript" from <script>
* Remove trailing slash from <meta>, <img>, etc.
* Use <section> and proper headings whenever possible

This is a good first bug. Feel free to take it!
Hey, I am a student learning about open source development at Seneca College in Toronto. Is it possible if you can assign this to me and I would love to contribute? Thanks a lot
Welcome Fateh, feel free to take this! The repository can be found at https://github.com/mozilla-bteam/bmo

I'm also a student at George Brown College now. Let me know if you have any questions.
Assignee: nobody → fatehsandhu
Status: NEW → ASSIGNED
(In reply to Kohei Yoshino [:kohei] from comment #2)
> Welcome Fateh, feel free to take this! The repository can be found at
> https://github.com/mozilla-bteam/bmo
> 
> I'm also a student at George Brown College now. Let me know if you have any
> questions.

Thanks for the prompt reply, If I could please get some help in getting started that would be greatly appreciated. I am confused about which files should I be tackling? Any help would be greatly appreciated. 

Happy Holidays!!
Sure! Most templates are located under https://github.com/mozilla-bteam/bmo/tree/master/template/en/default

And actually most of the issue mentioned above are in https://github.com/mozilla-bteam/bmo/blob/master/template/en/default/global/header.html.tmpl and https://github.com/mozilla-bteam/bmo/blob/master/template/en/default/global/footer.html.tmpl

You'll find the old-school charset definition, <div id="bugzilla-body"> (should be <main>), etc. in it.

Some other templates can be found at https://github.com/mozilla-bteam/bmo/tree/master/extensions

You can simply search and replace in your favourite editor by using a term like:

* <script type="text/javascript">
* /> (for a trailing slash of <br>, <img>, <input>, <meta>)

and filtering the results with the *.html.tmpl file extension.

You can also search <h2>, <h3>, <h4> to add <section>s, but it cannot be done automatically. Sometimes it may be difficult to understand where's the end of a section. It's just good to have, not mandatory :)
Thank You So Much. I really appreciate your help. I will get on it right away.
This is not an urgent stuff so you can do it any time!
This really makes it easy! Thank you for welcoming me to open source development!
(In reply to Kohei Yoshino [:kohei] from comment #6)
> Created attachment 8938846 [details]
> Search & replace example in VS Code

Looks like this result isn't complete; you'll still have to search type="text/javascript" but this bug is relatively easy anyway :)
I made a commit for some of the things. Could you please have a look at them?
Also I tried to do the <main> tag but it gave me an error while testing. Could you let know why.
Kind Regards
https://github.com/mozilla-bteam/bmo/pull/320
Attached file github pull request
(In reply to Kohei Yoshino [:kohei] from comment #8)
> (In reply to Kohei Yoshino [:kohei] from comment #6)
> > Created attachment 8938846 [details]
> > Search & replace example in VS Code
> 
> Looks like this result isn't complete; you'll still have to search
> type="text/javascript" but this bug is relatively easy anyway :)

I made some of the changes, could you please have a look at them?

Kind Regards
Comment on attachment 8939127 [details] [review]
github pull request

Thanks again for the contribution!
Attachment #8939127 - Flags: review+
(In reply to Kohei Yoshino [:kohei] from comment #12)
> Comment on attachment 8939127 [details] [review]
> GitHub pull request
> 
> Thanks again for the contribution!

Thank You so much!!
I hope we work together again sometime!
Status: ASSIGNED → RESOLVED
Closed: 3 years ago
Resolution: --- → FIXED
You need to log in before you can comment on or make changes to this bug.